web前端学习HTML表格的属性标记有哪些?

web前端学习HTML表格的属性标记有哪些?,第1张

HTML表格的基本结构包括<table>、<caption>、<tr>、<td>、<th>等标记

1:<table>标记有以下属性

① width属性:表示表格的宽度

② height属性:表示表格的高度

③ border属性:表示表格外边框的宽度

④ align属性表示表格的显示位置:left居左显示;center居中显示;right居右 显示。

⑤ cellspacing属性:单元格之间的间距

⑥ cellpadding属性:单元格内容与边框的显示距离

⑦ frame属性:控制表格边框外层的四条线框

⑧ rules属性:控制显示单元格之间的分割线

2:<caption>标记用于表格中使用标题

<caption>标记的align属性有四个取值:

① top表示标题放在表格的上部

② bottom表示标题放在表格的下部

③ left表示标题放在表格的左部

④ right表示标题放在表格的右部

3:<tr>标记用来定义表格的行,对于每一个表格行,都是由一对<tr>...</tr>标记表示。<tr>标记有如下几种属性

① bgcolor属性用来设置背景颜色

② align属性用来设置垂直方向对齐方式

③ valign属性用来设置水平方向对齐方式

4:<td>和<th>都是单元格的标记,其必须嵌套在<tr>标记中,成对出现。<th>是表头标记,<th>中的文字会被默认加粗,而<td>不会,<td>是数据标记,表示该单元格的具体数据。两者的标记属性是一样的:

① bgcolor属性用来设置背景颜色

② align属性用来设置垂直方向对齐方式

③ valign属性用来设置水平方向对齐方式

④ width属性用来设置表格的宽度

⑤ height属性用来设置表格的高度

⑦ rowspan设置单元格所占行数

⑧ colspan设置单元格所占列数

HTML里表格的标签是<table>和</table>,单元格的标签是<tr><td></td></tr>,另一种用实际尺寸单位,常用像素PX表示, *** 作方法如下:

1、首先双击打开HBuilderX工具,在已新建的Web项目中,新建一个静态页面css.html。

2、打开已新建的页面文件,引入核心的jquery文件并修改标签文字内容。

3、在body标签元素中,插入一个table表格并添加数据(三行)。

4、在一个td设置class属性值,利用table元素设置相关的css样式,然后使用类选择器设置宽度。

5、最后保存代码并运行页面文件,打开浏览器可以看到表格样式,就完成了。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/7432300.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-05
下一篇 2023-04-05

发表评论

登录后才能评论

评论列表(0条)

保存