<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css中的列表</title>
<style type="text/css">
ul.circle {
/*设置列表项的标记类型*/
list-style-type: circle;
}
ul.none {
list-style-type: none;
}
ul.img {
/*设置列表项前面的标记为一个图片*/
list-style-image: url(eg_arrow.gif);
/*设置标记的位置,inside表示在列表项中,outside表示在列表项之外*/
list-style-position: outside;
}
</style>
</head>
<body>
<p>Type circle:</p>
<ul class="circle">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
<p>Type none:</p>
<ul class="none">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
<p>Type img:</p>
<ul class="img">
<li>Coffee</li>
<li>Tea</li>
<li>Coca Cola</li>
</ul>
</body>
</html>
CSS基础知识梳理-列表ul
最新推荐文章于 2021-09-29 19:08:26 发布