小编Rya*_*mas的帖子

我正在为通过 GatsbyJS 制作的网站制作导航栏。我试图在导航栏中设置链接的样式，使它们没有下划线。

我已经将链接设置为没有任何文本装饰——当我在浏览器中检查元素时，它甚至显示“文本装饰：无”属性。我也确认我的CSS影响了对象——我可以改变文本的颜色，例如，我不能影响的只是文本装饰。

CSS：

.nav {
  background: #fd8;
}

.nav ul {
  text-align: center;
  border: 1px solid #000;
}

.nav ul li {
  display: inline-block;
  padding: 8px 10px;
  margin: 0;
}

.nav ul li a {
  color: #221;
  text-decoration: none;
}

html + js：

...
import { Link } from "gatsby"
import styles from "./navbar.module.css"

...

      <nav className={styles.nav}>
        <ul>
          <li>
            <Link style={{ textDecoration: 'none' }} to="/about">
              About
            </Link>
          </li>

编辑：带有 textDecoration 的内联样式是我在发布此问题之前所做的一些摆弄的产物，直到最近才出现。删除它对问题没有影响。

按请求呈现的 HTML：

<nav class="navbar-module--nav--25Dcz">
  <ul>
    <li>
      <a …

我正在构建一个 React 应用程序，它采用日历的形式，用户应该能够单击日历上的日期。这些日子由大方块表示，以便它们可以包含当天的信息。出于可访问性的原因，使用<button>s 似乎是最明智的选择，但我的研究（为什么 <button> 元素不能包含 <div>？）+（https://www.w3.org/TR/2012/WD -html5-20120329/the-button-element.html#the-button-element ) 表示将 div 放在按钮内是不正确的。我能想到的唯一的其他选择是将日子变成<div>自己的日子，但使它们可点击并手动提供它们tabIndex和role适合可访问性目的的功能。

<div>对于可点击区域（其中还可能包含多个 s），正确的 html 标签或方法是什么？