CSS中列表的list-style属性

修改li元素的display属性,即可去掉列表样式

代码伺候:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>hello</title>
		<script src="js/jquery.js"></script>
		<style type="text/css">
			
			#test{
				position: absolute;
				right: 0;
				top: 50%;
				margin: 0;
				padding: 0;
			}
		    #test li{
				display: block;
				width: 20px;
				height: 20px;
				border-radius: 50%;
				border: 1px solid;
			}
		</style>
		<body>
		    
			<ul id="test">
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</body>
</html>

 上列中  并未设置list-style: none; 可是li元素前的黑点却消失了,即列表样式被消除了。

 

上列中若 不设置display属性,即去掉红色标注的那行代码:

运行结果如下:

 

 

li元素默认的display属性值为:display: list-item;    该属性值会在li元素前显示一个黑点。

猜你喜欢

转载自www.cnblogs.com/xiaohaodeboke/p/12525071.html