个人中心
gpt4 book ai didi

html - 为可访问的 编写准确的 标签之间的单词隐藏表格列

我尝试使用下面的函数来隐藏基于第一个标签之间的单词的列以下是我到目前为止所拥有的但目前不起作用 $('#MenuContent_butUsers').click(function () { h

  • javascript - 将表格标题列 th 分成两个 th

    我想让下面的输出看起来像图像中的一样，只将标题 th 分成两个 th 就像蓝线我需要两个用于单个 td 的 header ，请帮忙，谢谢。 table { font-family: aria

  • php - 如何使html表列
    • 根据mysql中选定的列动态更改

    我有多个选择选项。但是，我希望当我选择 1 个或两个选项或其他选项时更改列 动态生成html并从数据库获取数据 目前我已经创建了多重选择选项和 html 表格

  • jquery - 查找标题为子 TH 的表行的所有 TH

    我有一个表，它有一个表头，它有如下子表头: table, th, td { border: 1px solid black; } Fisrt Name Last Na

  • java - thymeleaf th :each filtered with th:if

    我需要迭代并创建 每个 component 的元素在components具有 name 的数组的 'MATERIAL' 我的代码如下 此代码在生成一组空 之前一切正常元素如果

  • thymeleaf - th :text and th:value in Thymeleaf之间的区别

    我最近才开始在我的一个项目中使用 Thymeleaf。我见过一些在某些地方使用 th:text=${example} 的示例 th:value=${example}。 我已经浏览了 Thymeleaf

  • java - Thymeleaf "th:each"忽略 "th:switch"？

    首先，我检查从中获取轨道列表的项目是否是 CD。如果这是真的，我想循环列表并为每个条目创建一个段落。我的问题是，对于非 CD 的项目，我会在 ${item.getTrackList()} 处收到错误，

  • javascript - 如何在没有文本嵌套在 TH 的子节点中的情况下将文本嵌套到 TH 中？

    我解析一些站点并获取 TH 元素实例，然后我使用 innerText 获取所需的文本，当有一些我不需要的额外垃圾文本时，问题就来了。无论如何我只能获得顶级文本吗？ var th_elem = /*so

  • javascript - jQuery 查找
    • 不为空且具有特定类名

    我有一个脚本可以将表解析为 json。 这样的效果很好 Name Value 与脚本逻辑: var headers = []; $(rows.s

  • html - 在
    • 下的下拉列表使用默认 "Select"选项？

    我正在使用一个位于“th”标签下的下拉框。我正在使用以下代码。 Element_Name 我动态调用我的下拉元素。 我想在列表顶部显示“选择”作为我的默认元素。我已尝试使用以下代码。但这并没有奏效。

  • html - Thymeleaf 使用 th :if within a th:block

    我是 thymeleaf 的新手，我正在尝试创建一个 html 表，其中一个 boolean 值决定文本在某些列中是通过还是失败。 SmokeTest.passOrFailArray 是一个 bool

  • html - Thymeleaf 使用 th :if within a th:block

    我是 thymeleaf 的新手，我正在尝试创建一个 html 表，其中一个 boolean 值决定文本在某些列中是通过还是失败。 SmokeTest.passOrFailArray 是一个 bool

  • javascript - 如何使用 Jquery 将 th 动态添加到现有的 th

    我如何使用 Jquery 动态地为 th 添加值。我希望在 Heading7 之后将值附加到 Heading8 和 Heading9 Heading1 He

  • javascript - 带有 TH onclick 的下拉菜单触发 TH click，而不是下拉菜单

    我正在尝试创建一个包含可排序行的表格 - 但其中一行也需要一个下拉列表。 问题是，当单击下拉菜单时 - 表头的单击事件正在触发，导致不应该发生的事情发生。 我发现了这个: http://www.vel

    • 太空宇宙
    个人简介

    我是一名优秀的程序员,十分优秀！

    滴滴打车优惠券免费领取
    滴滴打车优惠券
    全站热门文章
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com
    转载 作者：太空宇宙 更新时间：2023-11-04 15:28:53 24 4
    gpt4 key购买 nike

    我正在关注 UN's accessibility guidelines编写可访问的表。

    我有这张 table 。我做了什么-我认为-应该是<th> 粗体。

    Table

    这是 HTML:

    <table width="100%">
        <thead>
            <tr>
                <th>Year</th>
                <th>1991</th>
                <th>1995</th>
                <th>2000</th>
                <th>2002</th>
                <th>2007</th>
            </tr>
        </htead>
        <tbody>
            <tr>
                <th>Indicator 1</th>
                <td>3.0</td>
                <td>11.0</td>
                <td>7.8</td>
                <td>4.0</td>
                <td>4.7</td>
            </tr>
            <tr>
                <th>Indicator 2</th>
                <td>9.0</td>
                <td>23.4</td>
                <td>19.5</td>
                <td>9.4</td>
                <td>9.1</td>
            </tr>
            <tr>
                <th>Indicator 3</th>
                <td>18.7</td>
                <td>32.0</td>
                <td>30.0</td>
                <td>20.1</td>
                <td>21.8</td>
            </tr>
        </tbody>
    </table>

    但我不确定它是否准确。我认为这更有意义:

    <table>
        <tbody>
            <tr>
                <th id="year">Year</th>
                <td headers="year" id="year-1991">1991</td>
                <td headers="year" id="year-1995">1995</td>
                <td headers="year" id="year-2000">2000</td>
                <td headers="year" id="year-2002">2002</td>
                <td headers="year" id="year-2007">2007</td>
            </tr>
            <tr>
                <th id="indicator-1">Indicator 1</th>
                <td headers="indicator-1 year-1991">3.0</td>
                <td headers="indicator-1 year-1995">11.0</td>
                <td headers="indicator-1 year-2000">7.8</td>
                <td headers="indicator-1 year-2002">4.0</td>
                <td headers="indicator-1 year-2007">4.7</td>
            </tr>
            <tr>
                <th id="indicator-2">Indicator 2</th>
                <td headers="indicator-2 year-1991">9.0</td>
                <td headers="indicator-2 year-1995">23.4</td>
                <td headers="indicator-2 year-2000">19.5</td>
                <td headers="indicator-2 year-2002">9.4</td>
                <td headers="indicator-2 year-2007">9.1</td>
            </tr>
            <tr>
                <th id="indicator-3">Indicator 3</th>
                <td headers="indicator-3 year-1991">18.7</td>
                <td headers="indicator-3 year-1995">32.0</td>
                <td headers="indicator-3 year-2000">30.0</td>
                <td headers="indicator-3 year-2002">20.1</td>
                <td headers="indicator-3 year-2007">21.8</td>
            </tr>
        </tbody>
    </table>

    你怎么看？有没有人有使用表格和可访问性的经验？如果可能，请提供引用。谢谢。

    注意:我知道 summary属性，但为简单起见，我在此处将其删除。

    最佳答案

    对于像这样具有简单结构的表格，您的标记(第一个简单版本)足以实现可访问性。具有类似结构的表格出现在 WCAG 2.0 的 HTML 和 XHTML 技术中，项目 Using table markup to present tabular information ，没有额外的标记，只有标题单元格的 th。

    结构更复杂的表格可能需要特殊技术。

    但是，数据表通常应该有一个 caption 元素以提高可访问性和可用性。它可以帮助用户获取有关整个表的关键信息。代替标题，标题或表格前的文本可以用于此目的，但它们不会以相同的方式与表格相关联(在标记级别)。

    关于html - 为可访问的 <table> 编写准确的 <th>，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16759047/

    24 4 0
    		元素中添加 元素

    我有一个 html 表格，其中一个标题跨越 2 列。如何向两列中的每一列添加子标题？ 例如在附图中，我希望“联系人”列的各个列具有子标题“电话”和“地址”。 最佳答案 如果你在纸上画出表格，你会采用同

  • java - thymeleaf - 组合 th :each with th:href

    我是 Thymeleaf(和 webdev)的新手，我正在尝试将 Thymeleaf 迭代 (th:each) 与 URL 重写 (th:href) 结合起来。 hello 这会产生以下结果(其中

  • thymeleaf: th:value 在使用 th:field 时被忽略

    我有一个表单，我想在其中编辑一些用户数据。 所以已经存储的数据被放置为 th:value 并且在发送后我使用 spring 验证进行验证并希望在错误输入时返回表单。我希望输入字段具有用户输入的值，但它

  • javascript - 如何对