我是靠谱客的博主 高高刺猬,这篇文章主要介绍css如何设置td宽度,现在分享给大家,希望可以做个参考。

本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

css直接使用width属性设置表格td的宽度:

示例:

复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>document</title> <style> td.box1 { width:10%; border: medium solid red } td.box3 { width:15%; border: medium solid red } td.box5 { width:20%; border: medium solid red } td.box4 { width:45%; border: medium solid red } </style> </head> <body> <table width="100%"> <td class="box1">10%</td> <td class="box1">10%</td> <td class="box3">15%</td> <td class="box4">45%</td> <td class="box5">20%</td> </table> </body> </html>
登录后复制

效果图:

4{$(`A~YLG1HGET@P54X9[2.png

width 属性设置元素的宽度。

这个属性定义元素内容区的宽度,在内容区外面可以增加内边距、边框和外边距。

属性值:

  • auto 默认值。浏览器可计算出实际的宽度。

  • length 使用 px、cm 等单位定义宽度。

  • % 定义基于包含块(父元素)宽度的百分比宽度。

  • inherit 规定应该从父元素继承 width 属性的值。

推荐学习:css视频教程

以上就是css如何设置td宽度的详细内容,更多请关注靠谱客其它相关文章!

最后

以上就是高高刺猬最近收集整理的关于css如何设置td宽度的全部内容,更多相关css如何设置td宽度内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(133)

评论列表共有 0 条评论

立即
投稿
返回
顶部