我们专注攀枝花网站设计 攀枝花网站制作 攀枝花网站建设
成都网站建设公司服务热线:400-028-6601

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

css表格的样式,css表格样式添加边框

怎么用CSS设置html中的表格边框样式

设置表格的样式可以直接使用css的border样式来设置的。

10年积累的成都网站建设、做网站经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站设计制作后付款的网站建设流程,更有大武口免费网站建设让你可以放心的选择与我们合作。

工具原料:编辑器、浏览器

1、设置一个表格的外边框为红色,内边框的为黄色,代码如下:

body 

table

tr

td知道/td

td知道/td

td知道/td

/tr

tr

td知道/td

td知道/td

td知道/td

/tr

tr

td知道/td

td知道/td

td知道/td

/tr

/table

style

table {

border:1px solid red;

}

td{

border: 1px solid yellow;

}

/style

/body

2、运行的效果如下:

CSS 表格属性

CSS表格属性用于设置HTML表格的样式,HTML表格由 table/table 标签嵌套 tbody , tr , td 等标签组成,一个HTML表格默认至少包含table,tbody,tr,td四个元素。

CSS表格属性:

显示表格边框有时候特别重要,它能让表格结构更清晰。

默认的表格有双边框,这是因为表和th/ td元素有独立的边界。border-collapse 属性设置表格的边框是否被折叠成一个单一的边框或隔开。

怎么设置css表格的样式(颜色等)

下面来个例子,你可以复制到你的编辑器里修改测试

style type="text/css"

table.gridtable {}{

font-family: verdana,arial,sans-serif;

font-size:11px;

color:#333333;

border-width: 1px;

border-color: #666666;

border-collapse: collapse;

}

table.gridtable th {}{

border-width: 1px;

padding: 8px;

border-style: solid;

border-color: #666666;

background-color: #dedede;

}

table.gridtable td {}{

border-width: 1px;

padding: 8px;

border-style: solid;

border-color: #666666;

background-color: #ffffff;

}

/style

!-- Table goes in the document BODY --

table class="gridtable"

tr

thInfo Header 1/ththInfo Header 2/ththInfo Header 3/th

/tr

tr

tdText 1A/tdtdText 1B/tdtdText 1C/td

/tr

tr

tdText 2A/tdtdText 2B/tdtdText 2C/td

/tr

/table

CSS(层叠样式表)级联样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。

css表格样式怎么实现?

table{

border-collapse: collapse; //相邻边被合并

background-color: #cccccc; //设置表格背景色

border-top: 1px solid #000000; //设置表格上边框颜色

border-left: 1px solid #000000; //设置表格左边框颜色

border-right: 1px solid #000000; //设置表格右边框颜色

border-bottom: 1px solid #000000; //设置表格下边框颜色

}

td {

border-right: 1px solid #000000; //设置td颜色

border-bottom: 1px solid #000000; //

}

表格制作练习可以到实战帮。


本文标题:css表格的样式,css表格样式添加边框
转载源于:http://mswzjz.cn/article/phjcdg.html

其他资讯