HTML <td> 标签的 scope 属性

实例

下面的例子把两个 th 元素标识为列的表头,把两个 td 元素标识为行的表头:

<table border="1">
<tr>
<th scope="col">Month</th>
<th scope="col">Savings</th>
</tr>
<tr>
<td scope="row">1</td>
<td>January</td>
<td>$100.00</td>
</tr>
<tr>
<td scope="row">2</td>
<td>February</td>
<td>$10.00</td>
</tr>
</table>

亲自试一试

定义和用法

scope 属性定义将表头单元与数据单元相关联的方法。

scope 属性标识某个单元是否是列、行、列组或行组的表头。

scope 属性不会在普通浏览器中产生任何视觉变化。

屏幕阅读器可以利用该属性。

详细解释

使用 scope 属性,可以将数据单元格与表头单元格联系起来。

通过属性值 row,表头行包括的所有表格都将和表头单元格联系起来。指定 col,会将当前列的所有单元格和表头单元格绑定起来。

使用 rowgroup 和 colgroup 会将单元格的行组(由 <thead>、<tbody> 或 <tfoot> 标签定义)或列组中的所有单元格和表头单元格绑定起来(由 <col> 或 <colgroup> 标签定义)。

浏览器支持

由于不会在普通浏览器中产生任何视觉效果,很难判断浏览器是否支持 scope 属性。

语法

<td scope="value">

属性值

值 描述
col 规定单元格是列的表头。
row 规定单元格是行的表头。
colgroup 规定单元格是列组的表头。
rowgroup 规定单元格是行组的表头。

<td>标签scope属性的更多相关文章

  1. HTML初学者常用标签及属性

    1.HTML5头部结构   [DOCTYPE html] 声明文档类型为HTML5文件. 文档声明在HTML5文档必不可少,且必须放在文档的第一行.   [meta标签] 1-charset属性:单独 ...

  2. HTML <td> 标签的 colspan 属性

    HTML <td> 标签的 colspan 属性 实例 表格单元横跨两列的表格: 浏览器支持 所以浏览器都支持 colspan 属性. 没有浏览器支持 colspan="0&qu ...

  3. div仿td标签属性

    链接:https://pan.baidu.com/s/1kW1At9d 密码:g0he 这里说的div是指固定大小的,动态往里面填充文字的时候,文字一直水平垂直居中(换行也是).就和td标签一样.当然 ...

  4. 【Spring源码解读】bean标签中的属性(一)你可能还不够了解的 scope 属性

    scope 属性说明 在spring中,在xml中定义bean时,scope属性是用来声明bean的作用域的.对于这个属性,你也许已经很熟悉了,singleton和prototype信手捏来,甚至还能 ...

  5. HTML+css基础 表格标签table Table标签属性 td标签属性

    表格标签table:   他是由行与列构成,最小单位是单元格. 行标签  <tr></tr> 单元格标签<td></td> Table标签属性: Bor ...

  6. 在表格中,th scope="row"和th scope="col"中的scope属性的用法及意义

    把表头和数据联系起来:scope,id,headers属性就我用到现在,很多表格要比上面提供的例子复杂的多.让例子复杂一点,我会移去"Company"表头,并且把第一列的数据移到表 ...

  7. h5废弃的标签和属性及新增的标签和属性

    一.废弃的标签和属性 1.表现性元素 a) basefont b) big c) center d) font e) strike f) tt 2.框架类元素 a) frame b) frameset ...

  8. Angular自定义指令directive:scope属性

    在AngularJS中,除了内置指令如ng-click等,我们还可以自定义指令.自定义指令,是为了扩展DOM元素的功能.代码中,通过指定directive中的restrict属性,来决定这个指令是作为 ...

  9. td标签内的内容过长导致的问题的解决办法

    问题描述:在开发过程中,td标签中的有一个cell格中的内容过长,导致td标签高度增加,从而导致整个页面内容的不协调:

随机推荐

  1. API自动化测试 Soap UI工具介绍

    一.   建立测试用例 (一)   基本概念 soapUI 中工程的层次结构 项目名称:位于最上层 (BookStoreTest),项目可以包含多个服务的定义. REST 服务定义:服务其实是对多个 ...

  2. WPF捕获全局未处理异常

    在WPF开发过程中我们一般都用try/catch块来捕获异常,但不是每个异常我们都能捕获,程序总会出现一些意想不到情况,抛出一些未捕获的异常,这时就要用到全局异常捕获,即在程序的最外层加上捕获未处理异 ...

  3. typescript项目中import 图片时报错:TS2307: Cannot find module ‘...’

    最近在用typescript写项目时,我用import来加载一个图片,webpack编译文件是会报错如下: 报错: 解决: 如果在js中引入本地静态资源图片时使用import img from './ ...

  4. IDEA通过Maven WebApp archetype 创建Spring boot项目骨架

    springboot项目资源: GitHub地址:https://github.com/TisFreedom/springbootdome.git 码云地址:https://gitee.com/Tis ...

  5. 主流服务器虚拟化技术简单使用——Hyper-V(一)

    Tips:因为博客园排版的原因,图片显示不清晰,可以放大网页查看清晰图片. 如果系统使用物理机,需要在BIOS里面开启Intel VT-x(或AMD-V),如果是VMware workstation, ...

  6. 分布式文件系统之FastDFS

    环境引入: 在一个大型的教育官网,会拥有大量优质的视频教程,并且免费提供给用户去下载,文件太多如果高效存储?用户访问量大如何保证下载速度?分布式文件系统是解决这些问题的有效方法之一 一.什么是文件系统 ...

  7. Angular material mat-icon 资源参考_Hardware

    ul,li>ol { margin-bottom: 0 } dt { font-weight: 700 } dd { margin: 0 1.5em 1.5em } img { height: ...

  8. C#之集合

    数组(http://www.cnblogs.com/afei-24/p/6738128.html)的大小是固定的.如果元素的个数是动态的,就应使用集合类. 列表(http://www.cnblogs. ...

  9. 验证客户端的链接合法性和socketserver模块实现并发

    本节内容: 1.验证客户端的链接合法性 2.socketserver模块实现并发 一.验证客户端的链接合法性 首先,我们来探讨一下,什么叫验证合法性, 举个例子:有一天,我开了一个socket服务端, ...

  10. python使用easyinstall安装xlrd、xlwt、pandas等功能模块的方法

    在日常工作中,使用Python时经常要引入一些集成好的第三方功能模块,如读写excel的xlrd和xlwt模块,以及数据分析常用的pandas模块等. 原生的python并不含这些模块,在使用这些功能 ...