我正在尝试设置 CSS 标签,我希望它们具有相同的高度和宽度。我如何使用以下 CSS 执行此操作:
#master_tab_layout
{
height: 35px;
}
#master_tab_layout li
{
display: inline;
overflow:hidden;
list-style-type:none;
background-color:#FE000C;
}
#master_tab_layout a, a.active
{
color: #DEDECF;
background: #0EB1E8;
font: bold 1em "Trebuchet MS", Arial, sans-serif;
border: 2px solid black;
padding: 2px 5px 0px 5px;
margin: 0;
width:150px;
text-decoration: none;
}
#master_tab_layout a.active
{
background: #FE000C;
border-bottom: 3px solid #ABAD85;
}
#master_tab_layout a:hover
{
color: #fff;
background: #FFF;
}
#master_tab_layout a:visited
{
color: #E8E9BE;
}
#master_tab_layout a.active:hover
{
background: #FE000C;
color: #DEDECF;
}
...以及随后的 HTML:
<div id="master_tab_layout">
<ul>
<li><a href="/howtoorder">How To Order</a></li>
<li><a href="/about_us">About Us</a></li>
</ul>
</div>
最佳答案
#master_tab_layout ul li {
width: 50px;
height: 25px;
}
这只会设置大小。如果你想让它们垂直,你需要使用 display: block;
另外,不要使用 a:active 来改变字体。它可能会改变大小并让用户感到厌烦。
关于html - 使 CSS 选项卡具有特定的宽度和高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1183337/