HTML表格css样式菜鸟教程,CSSTable（表格）CSS 表格
使⽤CSS可以⼤⼤提⾼HTML表格的外观。 Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Berglunds snabbköp Christina Berglund Sweden
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Handel Roland Mendel Austria
Island Trading Helen Bennett UK
Königlich Essen Philip Cramer Germany
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini Alimentari Riuniti Giovanni Rovelli Italy
North/South Simon Crowther UK
Paris spécialités Marie Bertrand France
The Big Cheese Liz Nixon USA
Vaffeljernet Palle Ibsen Denmark
表格边框
指定CSS表格边框，使⽤border属性。
下⾯的例⼦指定了⼀个表格的Th和TD元素的⿊⾊边框：
实例
table, th, td
{
border: 1px solid black;
}
尝试⼀下 »
请注意，在上⾯的例⼦中的表格有双边框。这是因为表和th/ td元素有独⽴的边界。
为了显⽰⼀个表的单个边框，使⽤ border-collapse属性。
折叠边框
border-collapse 属性设置表格的边框是否被折叠成⼀个单⼀的边框或隔开：
实例
table
{
border-collapse:collapse;
}
table,th, td
{
border: 1px solid black;
}
尝试⼀下 »
表格宽度和⾼度
Width和height属性定义表格的宽度和⾼度。
下⾯的例⼦是设置100％的宽度，50像素的th元素的⾼度的表格：实例
table
{
width:100%;
}
th
{
height:50px;
}
尝试⼀下 »
表格⽂字对齐
表格中的⽂本对齐和垂直对齐属性。
text-align属性设置⽔平对齐⽅式，像左，右，或中⼼：
实例
td
{
text-align:right;
}
尝试⼀下 »
垂直对齐属性设置垂直对齐，⽐如顶部，底部或中间：
实例
td
{
height:50px;
vertical-align:bottom;
}
尝试⼀下 »
表格填充
如果在表的内容中控制空格之间的边框，应使⽤td和th元素的填充属性：实例
td
{
padding:15px;
}
尝试⼀下 »
表格颜⾊
下⾯的例⼦指定边框的颜⾊，和th元素的⽂本和背景颜⾊：
实例
table, td, th
{
border:1px solid green;
}
th
{
background-color:green;
color:white;
}
尝试⼀下 »
更多实例
制作⼀个个性表格
这个例⼦演⽰了如何创建⼀个个性的表格。
设置表格标题的位置html网页设计 table
这个例⼦演⽰了如何定位表格标题。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。