HTML表格怎么设置边框样式

本篇内容介绍了“HTML表格怎么设置边框样式”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

成都创新互联专业为企业提供钦州网站建设、钦州做网站、钦州网站设计、钦州网站制作等企业网站建设、网页设计与制作、钦州企业网站模板建站服务,十载钦州做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。

HTML表格怎么设置边框样式

对于边框的设置我们可以通过border属性来实现,比如给表格一个1px边框我们可以这样设置:

1

效果图:

HTML表格怎么设置边框样式

从上图我们可以发现这样设置只有表格的外边框才有,里面的单元格都无边框,所以我们也要给内部的单元格设置边框

1

2

3

table,table tr th, table tr td {

       border:1px solid #ccc;

        }

效果图:

HTML表格怎么设置边框样式

我们可以通过设置cellspacing(单元格间距), cellpadding(单元格边距)以及border-collapse: collapse (边框合并)使表格的边框合并为一个单一的边框,这样使得表格更加美观该属性设置表格的边框是否被合并为一个单一的边框,还是象在标准的 HTML 中那样分开显示使表格更加美化

            

            

            

        

        

            

            

            

        

        

            

            

            

        

        

            

            

            

        

    

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

    

        

内容内容内容
内容内容内容
内容内容内容
内容内容内容

效果图:

HTML表格怎么设置边框样式

同样通过设置border属性还可以更改表格边框的颜色

“HTML表格怎么设置边框样式”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注创新互联网站,小编将为大家输出更多高质量的实用文章!


当前题目:HTML表格怎么设置边框样式
本文网址:http://myzitong.com/article/ihdjco.html