Maison > Article > interface Web > Application de divers éléments de liste en HTML (un exemple)
Application de divers éléments de liste en HTML (un exemple)
- 不言original
- 2018-08-23 11:12:381989parcourir
Ce que cet article vous apporte concerne l'application de divers éléments de liste en HTML (un exemple). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.
1. Liste des éléments
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!-- list-style: none;可以清除有序列表或无序列表前面的数字或者符号-->
<style type="text/css">
ul {
list-style: none;
}
</style>
</head>
<body>
<ul type="circle"><!--空心圆无序列表-->
<li>first</li>
<li>second</li>
<li>third</li>
</ul>
<ul type="disc"><!--disc是默认值，实心圆无序列表-->
<li>first</li>
<li>second</li>
<li>third</li>
</ul>
<ul type="square"><!--实心方框，无序列表-->
<li>first</li>
<li>second</li>
<li>third</li>
</ul>
<ol type="A"><!--以字母A开始的有序列表-->
<li>first</li>
<li>second</li>
<li>third</li>
</ol>
<ol type="a"><!--以字母a开始的有序列表-->
<li>first</li>
<li>second</li>
<li>third</li>
</ol>
<ol type="i"><!--以小写罗马数字开始的有序列表-->
<li>first</li>
<li>second</li>
<li>third</li>
</ol>
<ol type="I" start="2"><!--以大写罗马数字开始的有序列表，start规定了列表开始的值-->
<li>first</li>
<li>second</li>
<li>third</li>
</ol>
<ol type="I"><!--以大写罗马数字开始的有序列表，value规定了第三个从Ⅳ开始，规定了第六个从Ⅷ开始-->
<li>first</li>
<li>second</li>
<li value="4">third</li>
<li>fouth</li>
<li>friday</li>
<li value="8">六</li>
<li>七</li>
</ol>
<dl><!--dl自定义列表，dt列表中的项目，d项目描述，自动换行并有缩进-->
<dt>一</dt>
<dd>hello world</dd>
<dd>welcome to html5</dd>
<dt>二</dt>
<dd>kan kan xiaoguo</dd>
</dl>
</body>
</html>2. Affichage des effets
Recommandations associées :
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Qu'est-ce qu'un tableau ? Introduction aux tableaux en HTMLArticle suivant：Qu'est-ce qu'un tableau ? Introduction aux tableaux en HTML