html语言dl与ul,HTML中DL、UL、OL用哪个比较好

大家好~  我是一枚正直纯洁的苦逼程序员!!!!!

ul,ol,dl标签是CSS网页布局中常用的列表元素。 列表将具有相似特征或先后顺序的内容按照从上到下的顺序排列起来。

1.ul标签:无序列表始于 u l 标签。每个列表项始于l i标签,此列项目默认使用粗体圆点(典型的小黑圆圈)进行标记。

2.ol标签:有序列表始于ol标签,每个列表项始于li标签,列表项目使用数字进行标记。

3.dl标签:dl标签是定义列表,自定义列表不仅仅是一列项目,而是项目及其注释的组合。自定义列表以 dl 标签开始。每个自定义列表项以 dt 开始。每个自定义列表项的定义以 dd 开始。

↑↑↑以上所有的列表项内部都可以使用段落、换行符、图片、链接以及其他列表等。

如何定义ul,ol,dl的样式?

在样式表中用list-style定义。

disc实心圆,默认值 circle空心圆 square实心方块 decimal阿拉伯数字 lower-roman小写罗马数字 upper-roman大写罗马数字 lower-alpha小写英文字母 upper-alpha大写英文字母

注:也可以去掉默认样式,设置list-style:none,然后根据自己需要添加不同的样式,比如添加特殊背景图片,使列表显示不一样的风格。

问题1:什么情况下用ul,什么情况下用ol?

回答:ul经常用来实现轮播的小按钮,下拉菜单的各种要用来排列的列表,多个a标签排列等,实用范围非常广。 而ol因为它的有序属性,用的范围就比较小了,不是一定要用有序来排列的情况下,一般都是用ul。

这一次讲的小课堂属实没问题可以说,因为挺简单的

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/370031.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

slot多作用域 vue_详解Vue.js 作用域、slot用法(单个slot、具名slot)

作用域HEi免费资源网在介绍slot前&#xff0c;需要先知道一个概念&#xff1a;编译的作用域。比如父组件中有如下模板&#xff1a;HEi免费资源网{{message}}这里的message就是一个slot&#xff0c;但是它绑定的是父组件的数据&#xff0c;而不是组件< child-component >的…

Java – JDK 8的远景

世界正在缓慢但肯定地发生变化。 经过更改后&#xff0c;Java有了JDK 7的全新外观&#xff0c;Java社区期待JDK 8&#xff08;可能还有JDK 9&#xff09;所带来的其余改进。 JDK 8的目标目的是填补JDK 7实施中的空白-该实施中剩下的部分难题&#xff0c;应该在2013年底之前为广…

CSS 学习路线(一)元素

元素(element) 类型:替换和非替换元素 替换元素(replaced element): 用来替换元素内容的部分并非由文档内容直接显示. eg:img input 非替换元素(nonreplaced element): 其内容由用户代理在元素本身生成的框显示. eg:绝大多数都是非替换元素 基本元素类型:块级(block-lev…

[urllib]urlretrieve在python3

python3下面要使用&#xff1a;urllib.request.urlretrieve()这种形式的调用 1 from urllib.request import urlretrieve 2 3 4 urlretrieve(url, path) 转载于:https://www.cnblogs.com/sigai/p/8178375.html

使用Gulp压缩CSS/JS

一、安装 1.安装gulp npm install -g gulp2.检查gulp 版本 gulp -v3.在项目文件夹下安装gulp npm install --save-dev gulp二、压缩JS 1.安装gulp-uglify模块 npm install gulp-uglify2.在项目根目录创建gulpfile.js文件 3.在gulpfile.js文件中写入代码 // 获取 gulpvar gulp …

android活动开始,android – 点击谷歌地图标记infoWindow开始活动

我建议使用HashMap或类似的东西.当您遍历对象列表并为它们创建标记时,还要将标记添加到列表中,使用对象的ID作为键,将标记作为值&#xff1a;private HashMap markerMap new HashMap();…for(MarkerObject obj : this.markerObjects){//If the marker isnt already being disp…

Hamcrest包含匹配器

与Hamcrest 1.2相比 &#xff0c;针对Matchers类的Hamcrest 1.3 Javadoc文档为该类的几种方法添加了更多文档。 例如&#xff0c;四个重载的contains方法具有更具描述性的Javadoc文档&#xff0c;如下面所示的两个比较屏幕快照所示。 尽管仅通过尝试就可以弄清楚“包含”匹配器…

华为cor—al10_cor al10是华为什么型号 cor al10是华为啥型号

cor al10是华为荣耀Play。外观方面&#xff0c;荣耀Play提供有星云紫&#xff0c;极光蓝&#xff0c;幻夜黑三种基础配色&#xff0c;以及幻夜黑与魅焰红的酷玩版配色&#xff1b;拍照方面&#xff0c;荣耀Play具有1600万AI双摄像头&#xff0c;前置摄像头为1600万像素&#xf…

函数 (四) 迭代器和生成器

一 迭代器 一 迭代的概念 #迭代器即迭代的工具&#xff0c;那什么是迭代呢&#xff1f;#迭代是一个重复的过程&#xff0c;每次重复即一次迭代&#xff0c;并且每次迭代的结果都是下一次迭代的初始值 while True: #只是单纯地重复&#xff0c;因而不是迭代print(>) l[1,2,3]…

进阶-JMS 知识梳理

JMS 一、 概述与介绍 ActiveMQ 是Apache出品&#xff0c;最流行的、功能强大的即时通讯和集成模式的开源服务器。ActiveMQ 是一个完全支持JMS1.1和J2EE 1.4规范的 JMS Provider实现。提供客户端支持跨语言和协议&#xff0c;带有易于在充分支持JMS 1.1和1.4使用J2EE企业集成模式…

android蓝牙pair,Android向更多蓝牙设备开放Fast Pair功能 配对更轻松了

原标题&#xff1a;Android向更多蓝牙设备开放Fast Pair功能 配对更轻松了 来源&#xff1a;cnBeta.COM蓝牙是一项应用非常广泛的无线技术&#xff0c;在无线音频配件、智能手表和智能家电中都广泛使用。不过蓝牙设备的配对体验并不优秀&#xff0c;而且无法实现跨平台的一致性…

用CSS让DIV上下左右居中的方法

例如 一个父div(w:100%;h:400px)中有一个子div(w:100px;100px;)。让其上下左右居中。 方法一&#xff08;varticle-align&#xff09; 理念 利用表格单元格的居中属性。 步骤 父div外层配置一个div&#xff0c;同时设置为表格元素 (display: table)&#xff0c;宽度为100%父…

功能性Java集合

如今&#xff0c;在功能上大肆宣传&#xff0c;因此至少在Java集合方面&#xff0c;我将简要介绍一下其中的功能。 我个人喜欢标准 集合API&#xff0c;但在某些情况下可能会很尴尬并添加其他详细信息。 在Java 8的更高版本中&#xff0c;这应该不是问题。 在那里&#xff0c;…

python绘制帕累托图

python绘制帕累托图代码 1 import pandas as pd2 import matplotlib.pyplot as plt3 plt.rcParams[font.sans-serif][SimHei]#表示可以显示中文4 plt.rcParams[axes.unicode_minus]False#表示可以正常显示正负号5 datapd.read_csv(catering_dish_profit.csv,index_coltype)6 pr…

currentStyle、getComputedStyle 获取样式

style.height 获取的是行间的样式 currentStyle.height、getComputedStyle(elem,null).height 获取的是 div 的 content 的宽高&#xff0c; clientHeight 获取的是 contentpadding&#xff0c; offsetHeight 获取的是contentpaddingborder。 <script> window.onload…

html5 测评游戏,暗黑之王评测:HTML5游戏铸就最华丽ARPG冒险

由白鹭时代(Egret Technology)与比悦科技联手推出的重度大型HTML5游戏《暗黑之王》&#xff0c;一款典型的ARPG手游&#xff0c;其HTML5版本推出以来&#xff0c;获得了来自业界、玩家和媒体的大量关注。其丰富的游戏内容和玩法&#xff0c;加上卓越的游戏性能表现&#xff0c;…

搞定flex布局

这几种方式的搭配使用可以轻松搞定 PC 端页面的常见需求&#xff0c;比如实现水平居中可以使用 margin: 0 auto&#xff0c;实现水平垂直同时居中可以如下设置&#xff1a;.dad {position: relative; } .son {position: absolute;margin: auto;top: 0;right: 0;bottom: 0;left…

Java基础5一数组的常见应用算法

常用算法 1.冒泡排序: 原理&#xff1a;比较两个相邻的元素&#xff0c;将值大的元素交换至右端 示例: public static void bubbleSort(int[] a) {int n a.length;//总共进行n-1轮的比较for (int i 1; i < n; i) {for (int j 0; j < n - i; j) {if (a[j] > a[j 1]…

使用Xtend构建Vaadin UI

今天&#xff0c;我决定向Xtend打个招呼。 我希望学习一些新的编程语言。 选择一个标准的清单并不多。 它必须是在JVM上运行的编程语言&#xff0c; 如果我不需要学习用于建筑应用的全新生态系统&#xff0c;那就太好了。 我已经检查了几个选项。 JVM的编程语言列表已不多了…

python 浏览器显示本地文件夹_浏览器读取本地文件

{"moduleinfo":{"card_count":[{"count_phone":1,"count":1}],"search_count":[{"count_phone":4,"count":4}]},"card":[{"des":"阿里云文件存储NAS是一个可共享访问&#xf…