19.overflow属性设置溢出内容_li 溢出

首先代码部分是一个简单的管理系统头部：

主题div Class为：header

标题div Class为：nav

标题中含有ul标签和六个li标签

CSS样式如下：

*{
			margin: 0px;
			padding: 0px;
		}
		.header{
			text-align: center;
			font-size: 24px;
		}
		.nav{
			border:1px solid #000;
			height:30px;
			line-height: 30px;
			padding-left: 20px;
			/* overflow: hidden; */
		}
		.nav ul{
			list-style: none;
		}
		.nav ul li{
			width: 20%;
			float: left;
		}
		ul{
			text-align: center;
		}

 因为li标签设置的宽度为20%，所以五个li标签会有一个溢出：

这时可以用 overflow属性来操作溢出的元素

吧CSS代码中注释的overflow属性释放后结果如下：

 overflow属性可选值：

 值得注意的是scroll值和auto值的区别：

scroll值带有上下左右四个方向的滚动条：

auto值只带有上下方向的滚动条：