这是我的CSS:
body {
margin: 0px;
background-color: white;
}
#navbar {
background-color: red;
margin: 0 auto;
width: 900px;
height: 200px;
}
#navbar a {
padding: 20px;
color: grey;
text-decoration: none;
font-weight: bold;
font-size: 20px;
}
导航栏是 body 内的一个 div,我在导航栏内有几个标签。
这是输出:
最佳答案
“ block 级”元素和“内联元素”之间存在差异。根据基本概念,“内联元素”的边距和填充仅在水平方向中有效,但在垂直方向中无效。
您的 Div 是 block 级元素,但 anchor 标记 是内联元素。给垂直空间使它成为一个 block 元素,正如您已经发现的那样,或者将 anchor 放在一个 div 中,它具有“填充”或“边距”形式的垂直空间!
div a {display:block;padding:20px;} OR div a{display:inline-block;padding:20px;}
在后两种情况下,填充现在也会在垂直方向上起作用,因为现在已经从内联形式转换为 block 级元素。希望,这有帮助!
https://stackoverflow.com/questions/29842440/