常用css样式

来源：互联网发布：智能大厦网络设计方案编辑：程序博客网时间：2024/06/05 10:05

CSS 背景

CSS 文本

CSS 字体

CSS 列表

CSS 表格

以上样式表的属性信息参考html API点击打开链接

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>常用的css样式</title>
</head>
<style type="text/css">
/*操作背景的样式*/
body{
background-image:url(cool.png);/*设置背景图片*/
background-repeat:no-repeat;/*设置背景图像是否及如何重复。*/
background-position:50% 200px;/*设置背景图像的起始位置。第一个值是水平位置，第二个值是垂直位置。*/
}
/*操作文本的样式*/
div{
color:#FF0000;
direction:rtl;/*设置文本的方向。*/
}
pre{
line-height:25px;/*设置行高。*/
letter-spacing:20px;/*设置字符间距。*/
text-align:center;/*对齐元素中的文本。*/
text-decoration:line-through;/*向文本添加修饰。*/
text-transform:uppercase;/*控制元素中的字母。*/
}
table{
width:500px;
border-collapse:separate;/*设置是否把表格边框合并为单一的边框。*/
border-spacing:20px;/*设置分隔单元格边框的距离。（仅用于 "separated borders" 模型）*/
empty-cells:hide;/*设置是否显示表格中的空单元格。（仅用于 "separated borders" 模型）*/
table-layout:fixed;
}
/*边框样式*/
div{
border-style:dotted solid double dashed; /*用于设置元素所有边框的样式，或者单独地为各边设置边框样式。*/
}
</style>
<body>
<div>这里是不是写了点什么呢</div>
<pre>
      静夜思
床前明月光，疑是地上霜；
举头望明月，低头思故乡。
     goODbye!
</pre>
<hr/>
<table border="1px">
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
<tr>
<td>木丁西</td>
<td>23</td>
<td>男</td>
</tr>
<tr>
<td>刘先森</td>
<td>13</td>
<td>男</td>
</tr>
<tr>
<td>木先生</td>
<td>707</td>
<td>男</td>
</tr>
<tr>
<td>张靓颖</td>
<td >26</td>
<td></td>
</tr>
</table>
</body>
</html>

0 0