在这节课的案例中，为什么可以不用设置li的宽？
来源：12-11 固定定位
慕粉1555086949
2022-07-01 16:10:16
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
}
body {
background-color: #eee;
}
ul {
cursor: pointer;
box-sizing: border-box;
position: fixed;
width: 120px;
height: 260px;
background-color: #fff;
left: 0;
top: 300px;
border-radius: 0 8px 8px 0;
box-shadow: 5px 5px 5px 3px rgba(0, 0, 0, 0.15);
padding: 0 30px;
}
li {
height: 52px;
list-style: none;
line-height: 52px;
text-align: center;
border-bottom: 2px solid #F3F5F7;
box-sizing: border-box;
color: #6d7278;
font-size: 14px;
}
li:hover {
color: #e02020;
}
li:last-child {
border-bottom: 0px;
}
</style>
</head>
<body>
<ul>
<li>新上好课</li>
<li>进站必学</li>
<li>学习线路</li>
<li>慕课专栏</li>
<li>限时拼团</li>
</ul>
</body>
</html>不设置，它们默认是60px，也就是ul的一半，但我把ul设置成200px时，它们又是
140px
写回答
1回答
-
同学你好，
1、这是因为ul中设置了padding属性为 0 30px;
padding: 0 30px;表示上下0px,左右30px
设置总宽度为200px时，得到宽度为：200-30-30=140，同理结果为60px也是这样得到的
2、直接设置li的宽也是可以的，同学可以自己试一下
祝学习愉快~
0
相似问题
如何设置中间浮动的盒子居中呢？
回答 1
老师，这个浮动我有点不理解。
回答 1