Question

所以我有一个导航栏，我稍后会从屏幕上方下拉。我希望整个列表项从蓝色变为灰色。我设法通过将显示设置为阻止来获得正确的宽度。但高度给了我一些问题。身高：100％无效。将顶部和底部填充设置为与列表项相同仅在显示不是块时有效。不仅仅是让按钮更大。

$subject = '|12||13||56||1||0|';
$re = '/^((?:\|[1-9]\d*\|)+)(?:\|0\|)*$/';

Answer 1

从li元素中删除填充，然后将其添加到a元素，同时inline-block在内联元素之间添加间隙，改为使用display: block; float: left。有关详细信息，请参阅以下代码段：

＆＃13;

ul {
  list-style: none;
  font-family: sans-serif;
  font-weight: 300;
  margin: 0;
  padding: 0;
  box-shadow: 0px 6px 15px #888888;
  font-family: impact;
  font-size: 25px;
}

.nav li {
  text-transform: uppercase;
  text-align: center;
  display: block;
  float: left;
  background-color: #3A97FF;
  width: 25%;
  margin: 0;
  padding: 0;
  color: #fff;
}

nav li:nth-child(even) {
  background-color: #1A77FF;
}

a {
  display: block;
  text-decoration: none;
  color: #fff;
  overflow: auto;
  padding: 40px 0;
}

a:hover {
  background: #292A29;
}

＆＃13;

<nav>
  <ul class="nav">
    <li><a href="../Portfolio/About.html">About</a>
    </li>
    <li><a href="../Portfolio/Contact.html">Contact</a>
    </li>
    <li><a href="../Portfolio/Support.html">Support</a>
    </li>
    <li><a href="../Portfolio/Work.html">Work</a>
    </li>
  </ul>
</nav>

＆＃13;

锚背景颜色变化

1 个答案: