*{margin: 0px;padding: 0px;}
#nav{background-color: #eee;width: 600px;height: 40px;
margin:0 auto ;}
#nav ul{list-style:none;/*去除圆点*/}
ul li{float: left;/*横着排列*/
/*width: 90px;每一项设置间距但是不能自适应*/
/*padding: 0 10px;*/
line-height: 40px;/*竖直居中*/
text-align:center; /*在li元素中水平居中*/
position: relative;/***************如何较好的运用***********/}
#nav ul li a{text-decoration: none;color: black;padding: 0 47px;/*设置刚好平均分布*/
display: block;/*转换为块级便签,具备width和height*/}
#nav ul li a:hover{background-color: #000;color: white}
/*原本nav里面各项间距在li元素里面设置padding
但是hover效果没有填满这个块,所以在a设置间距*/
/***************************************************************/
ul li ul li{float: none;/*前面设置了float:left会影响到这里*/text-align: left;}
/*在没有加入绝对定位以及相对定位,首页的框会随书名的变化而变化
给父元素先相对定位,再给子元素绝对定位*/
/*ul li ul 表示首页下面的一整块书名*/
ul li ul{position: absolute;left: 0px;top: 40px}/*ul li ul 表示首页下面的一整块书名*/
.zhankai1 li {margin-top: 2px;display:none;}
.zhankai1 li a{background-color: rgba(12,33,23,0.2);width: 120px;text-align: left;}
.zhankai1 li a:hover{background-color: black;color: white}
ul li:hover ul li{display: block;}
我后来只能给下面这些书名的框加了width才能让它没有分行显示,但是我看那个女老师的解说中并没有提到加width
2.还有一点就是我的书名
能不能让他往左一些呢