我有这个 html 和 css 代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
<style>
div.container{
border: 1px solid #F00;
}
a.padded
{
font-size: 14px;
font-weight: bold;
text-decoration: none;
background-color: #F0F0F0;
border: 1px solid #666666;
padding: 15px;
margin: 10px;
border-radius: 5px;
box-shadow: #CCC 2px 2px 2px;
color: #333333;
}
</style>
</head>
<body>
<div class="container">
<a href="#" class="padded">my padded link</a>
</div>
<div>Some other content</div>
</body>
</html>
我期望填充链接包含在它的父 DIV block 中，其中 DIV 将扩展到填充链接的任何高度。然而，DIV 和页面上的其他所有内容似乎都忽略了链接填充。
为什么会发生这种情况以及如何正确填充链接？
最佳答案
您需要做的是，为您的 anchor 标记指定一个 display:block 属性。
a.padded {
display: block;
/* display:inline-block; should
work too but is not supported in some version of IE */
}
关于html - 如何正确填充 HTML 链接？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/6727558/