列表在HTML中是一个常用的操作,几乎良多网页都呈现了列表来显示数据。今天我就在这里来分享下有序列表、无序列表和界说列表的相关常识。从界说到实例的一个总结和概况。
有序列表是ol标签和li标签的组合暗示,<ol>暗示有序列表的起头,</ol>暗示有序列表的竣事。这里为了申明有序列表的用法,将张三,王四,李五,马六用有序列表来暗示出来。
<html>
<head><title>列表节制</title></head>
<body>
<ol>
<li>张三</li>
<li>王四</li>
<li>李五</li>
<li>马六</li>
</ol>
</body>
</html>
如下图可以看到执行的成果,前面主动天机了1234作为序号。
良多时辰我们想在HTML中利用ABCD或者其他的需要来作为有序列表的序号该怎么做呢?
在HTML中供给了小写字母a来用小写字母暗示列表的序号,年夜写字母A用年夜写字母来暗示列表的序号,i小写罗马数字来暗示序号和I这个年夜写的罗马数字来暗示序号。可以看如下实例。
可以看到如下图的代码和例子,用年夜写字母作为这个有序列表的序号,写法是type="A",执行成果是A、B、C、D的序号。
对于有序列表来说,我们可能碰到一种环境是第二页接着第一页继续书写的,第二页的序号不从一起头的。对于这个环境我们该怎么设计呢?
序号不从一起头的,HTML给ul供给了一个属性,他就是start属性,具体用法如下实例:(这个有序列表从10起头)
<html>
<head><title>列表节制</title></head>
<body>
<ol type="1" start="10">
<li>张三</li>
<li>王四</li>
<li>李五</li>
<li>马六</li>
</ol>
</body>
</html>
可以看到这个有序列表是从10起头的,往下继续的一个序列号。
HTML中无序列表是用<ul>和<li>的组合节制标签,<ul></ul>节制了无序列表的起头和竣事,<li>/li>节制了列表中的项。具体实例如下:
<html>
<head><title>列表节制</title></head>
<body>
<ul>
<li>张三</li>
<li>王四</li>
<li>李五</li>
<li>马六</li>
</ul>
</body>
</html>
从下图执行成果可以看出,无序列表默认的是圆心实点作为无序列表的标识。
若是我么不想无序列表前面的标识是圆心的实点该怎么办呢?
这里供给了disc 实心圆,circle空心圆,square实心方块这几种项目符号便利大师利用。具体实例如下:
<html>
<head><title>列表节制</title></head>
<body>
<ul type="square">
<li>张三</li>
<li>王四</li>
<li>李五</li>
<li>马六</li>
</ul>
</body>
</html>
可以看到项目符号酿成了实心的方块了。其实还有自界说的项目符文,这个我放在零丁的一个经验中了。
界说列表是经由过程<dl><dt><dd>这三个组合标签来实现的,<dl></dl>暗示界说序列的起头和竣事,<dt></dt>暗示这被诠释的内容<dd></dd>对被诠释内容的一个诠释。
<html>
<head><title>列表节制</title></head>
<body>
<dl>
<dt>测验科目</dt></dt>
<dd>语文</dd>
<dd>数学</dd>
<dd>英语</dd>
</dl>
</body>
</html>
可以看到,被诠释的是测验科目,诠释内容为下面这三个科目。这此中用到了缩进来暗示的。
0 篇文章
如果觉得我的文章对您有用,请随意打赏。你的支持将鼓励我继续创作!