布局
overflow
当内容出现溢出的时候
visible: 对溢出内容不做处理,内容可能会超出容器。
hidden: 隐藏溢出容器的内容且不出现滚动条。
scroll: 隐藏溢出容器的内容,溢出的内容将以卷动滚动条的方式呈现。
auto: 当内容没有溢出容器时不出现滚动条,当内容溢出容器时出现滚动条,按需出现滚动条。此为body对象和textarea的默认值。
显示垂直方向的滚动条
overflow-y: scroll;
overflow-x: hidden;
控制文本不换行
white-space: nowrap;
display
设置或检索对象是否及如何显示
display: none; 隐藏对象。与visibility属性的hidden值不同,其不为被隐藏的对象保留其物理空间
display: inline; 指定对象为内联元素,即行级元素
display: block; 指定对象为块元素,使行级便签如span设置宽高有效
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{margin: 0px;padding: 0px;}
li{list-style: none;height: 28px;width: 170px;border: 1px solid #ccc;}
li:hover{background: blue;}
a{color: black;text-decoration: none;font: 14px/28px "微软雅黑";}
.first a{font-weight: bold;}
#nav ul{height: 30px;overflow: hidden;width: 170px;}
#nav ul:hover{height: auto;}
</style>
</head>
<body>
<div id="nav">
<ul>
<li class="first">
<a href="#">许昌学院</a>
</li>
<li>
<a href="#">体育学院</a>
</li>
</ul>
<ul>
<li class="first">
<a href="#">