Css的学习：ul li 问题收集

最新推荐文章于 2021-06-21 12:00:12 发布

企鹅漫步

最新推荐文章于 2021-06-21 12:00:12 发布

阅读量858

点赞数

分类专栏： Css

本文链接：https://blog.csdn.net/bamboo261/article/details/11093061

版权

Css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

问题：* {margin:0;padding:0;}

    * 是表示针对HTML的所有元素。 margin表示边框外面留的空白，后面的0表示不留空白。 padding表示边框内部带内容之间填充，后面的0表示不留空白。 border表示边框，后面的0px表示边框宽度为0像素，边框绘制方式none表示不绘制边框。

问题：ul{list-style:none; padding:0;}
     list-style:none 不使用项目符号 设置列表的格式为none。也就是没有格式。列表格式有好几种。有前面是圆点的。有是小正方快的等等。            padding:0 padding是内边距 内边距=0

问题：ul li{background: #888;display: none;}

	display: none;隐藏对象。与 visibility 属性的hidden值不同，其不为被隐藏的对象保留其物理空间

下面是演示代码：

<!DOCTYPE html>
<html>
  <head>
    <title>1-3</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	
	<style type="text/css">
		#menu{
			width: 300px;
		}
		
		.has_children{
			background: #69c;
			color: #fff;
			cursor: pointer;
		}
		
		.highlight{
			color: #fff;
			background: green;
		}
	
		ul{
			list-style:none;
			padding:0;
		}
		
		ul li{
				background: #888;
				display: none;
		}
	</style>
  </head>
  
  <body>
    <div id="#menu">
    
    	<ul class="has_children">中国
    		<li>北京</li>
    		<li>上海</li>
    		<li>天津</li>
    		<li>重庆</li>		
    	</ul>
    	
    	<ul class="has_children">美国
    		<li>纽约</li>
    		<li>华盛顿</li>
    		<li>拉斯维加斯</li>
    	</ul>
    	
    	<ul class="has_children">日本
    		<li>东京</li>
    		<li>名古屋</li>
    		<li>仙台</li>
    	</ul>
    
    </div>
  </body>
</html>