更改导航栏锚点中的填充，使其在合理列表中最多可用 space
Change padding in navigation bar anchors so that it takes maximum space available in justified list
我想要的是整个区域都可以点击。为此，我需要设置锚元素的填充。但是，我觉得只添加 ul li a{padding: 15px 15px;} 之类的东西是不对的，因为在全高清屏幕上我无法覆盖 <li> 元素之间的 space。如何设置填充以使 anchor 在其父 li 元素内有效居中？
我正在考虑使用 ul{text-align:center;}，但我想不出一种方法可以使它们占用最大 space 并像 text-align:justify; 那样在调整大小时重新排列。
我的目标是以下结构，即使调整屏幕大小也保持不变：
|---------------------------------------- ---------------------------------------------- ----------------------------------| |--------服务--------|------------产品--------|-------- --联系我们------------|------------网店----------| |------------------------------------------------ ---------------------------------------------- ------------------------------|
| 之间的所有区域基本上都是填充 - 受背景颜色影响，可点击。
我想在没有 JS 的情况下使用 CSS/HTML。这是我目前拥有的：JSFiddle。虽然可以更好地处理较小屏幕上的视图，但这还不够重要。
如有任何建议，我们将不胜感激。我看了很多问题和答案，但找不到结合我所拥有的东西的解决方案。
使用display: table和display: table-cell
其中 ul 是 table，li 是 table-cell
有关如何实施此检查的更多信息，请查看 this link
这是 link 到 update fiddle
我认为你可以在没有填充的情况下做到这一点。只需将锚元素定义为块，将列表项保持为 inline-block 并在列表项上设置百分比宽度。
然后，使您的锚点的文本居中，宽度和高度均为 100%。我已经更新了你原来的 fiddle 来说明这一点：
https://jsfiddle.net/z1v1wfnb/2/
我想要的是整个区域都可以点击。为此，我需要设置锚元素的填充。但是，我觉得只添加 ul li a{padding: 15px 15px;} 之类的东西是不对的，因为在全高清屏幕上我无法覆盖 <li> 元素之间的 space。如何设置填充以使 anchor 在其父 li 元素内有效居中？
我正在考虑使用 ul{text-align:center;}，但我想不出一种方法可以使它们占用最大 space 并像 text-align:justify; 那样在调整大小时重新排列。
我的目标是以下结构，即使调整屏幕大小也保持不变：
|---------------------------------------- ---------------------------------------------- ----------------------------------| |--------服务--------|------------产品--------|-------- --联系我们------------|------------网店----------| |------------------------------------------------ ---------------------------------------------- ------------------------------|
| 之间的所有区域基本上都是填充 - 受背景颜色影响，可点击。
我想在没有 JS 的情况下使用 CSS/HTML。这是我目前拥有的：JSFiddle。虽然可以更好地处理较小屏幕上的视图，但这还不够重要。
如有任何建议，我们将不胜感激。我看了很多问题和答案，但找不到结合我所拥有的东西的解决方案。
使用display: table和display: table-cell
其中 ul 是 table，li 是 table-cell
有关如何实施此检查的更多信息，请查看 this link 这是 link 到 update fiddle
我认为你可以在没有填充的情况下做到这一点。只需将锚元素定义为块，将列表项保持为 inline-block 并在列表项上设置百分比宽度。
然后，使您的锚点的文本居中，宽度和高度均为 100%。我已经更新了你原来的 fiddle 来说明这一点： https://jsfiddle.net/z1v1wfnb/2/