Question

我正在尝试在ul标记内创建按钮。这很简单，但工作正常，但W3C无法验证，因为ul的直接子元素必须为li。

如果我将链接标记放在li内，它会被验证，但只有按钮的文本才会成为链接。

有什么办法只使用html＆amp; CSS？

    <ul class="nav">
        <li><a href="index.html">Home</a></li>
        <li><a href="about.html">About us</a></li>
    </ul>

编辑：当我问这个问题时，我真的不知道我在想什么，因为我是一个完全的业余爱好者。那好吧。未来的读者：把它放在div中。

Answer 1

好吧，我认为您的后续工作是使整个链接可以点击而不仅仅是文本。你需要做的就是让你的锚成为一个块元素，然后它将占用np.random.seed(10) dfs = [] def expand(x): N = np.random.choice([2,3,4]) df = pd.DataFrame([x.values.tolist()], columns=x.index).reindex(range(N)) df.A = df.A.fillna(1).cumsum() df.insert(1,'prevA', df.A.shift()) dfs.append(df) df.apply(expand, axis=1) df1 = pd.concat(dfs, ignore_index=True) df1.A = df1.A.astype(int) df1.id = df1.id.ffill().astype(int) df1.prevA = df1.prevA.bfill().astype(int) df1.B = df1.B.fillna(pd.datetime.now()) print (df1) id prevA A B 0 1 374 374 2014-02-01 04:45:04.401502 1 1 374 375 2016-12-07 10:48:14.299336 2 1 375 376 2016-12-07 10:48:14.299336 0 2 284 284 2014-03-12 21:23:12.401502 1 2 284 285 2016-12-07 10:48:14.299336 2 2 285 286 2016-12-07 10:48:14.299336 0 3 183 183 2014-02-01 09:12:08.401502 1 3 183 184 2016-12-07 10:48:14.299336的全宽：

li

.nav a {
  display:block;
}

Answer 2

我假设您尝试制作菜单并想要更大的按钮而不仅仅是链接文本。您应该在显示的列表元素内设置链接，然后将链接作为按钮。水平菜单的非常简单的css示例将是这样的：

git log --format="%cn" | sort | uniq -c | sort -nr

对于水平菜单，您应该使用填充和带高度的高度来设置宽度。除非您希望每个按钮的大小相同，否则您可以使用宽度。更深入的例子是http://medialoot.com/blog/how-to-create-a-responsive-navigation-menu-using-only-css/

Answer 3

我认为您的问题可能是您将<li>设置为菜单按钮，但文本是唯一可点击的部分，这是正确的吗？

您需要做的是，不要将<li>设为菜单按钮，而是设置<a>。

以下是演示：https://jsfiddle.net/arrx7dL7/

正如您所看到的，样式应用于链接，而不是li

HTML：

<ul class="menu">
  <li><a class="menu-item" href="#">Item 1</a></li>
  <li><a class="menu-item" href="#">Item 2</a></li>
  <li><a class="menu-item" href="#">Item 3</a></li>
  <li><a class="menu-item" href="#">Item 4</a></li>
</ul>

CSS：

.menu {
  list-style:none;
}
.menu-item {
  color:black;
  text-decoration: none;
  background: #eee;
  border: 1px solid #ccc;
  padding:20px 30px;
  display:block;
}

我认为这就是你的意思，如果是的话，我希望它有所帮助。

ul中的验证按钮

3 个答案: