标签:att 字符 cas :link back gre 设置 www 列表
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>css样式表</title>
<style type="text/css">
/*1.css背景
2.css文本
3.css字体
4.css链接
5.css列表
6.css表格
7.css轮廓
*/
#p1 {
background-color: pink;
margin: auto;
padding: 20px;
}
#p2 {
background-image: url(2.jpg);/*所有的背景属性都不能继承 */
padding: 200px;
/*background-repeat: repeat-x;*/
/*background-repeat: repeat-y;*/
background-repeat: no-repeat;
/*background-position: left;*/
background-position: 0% 0%;/*水平 垂直*//*background-attachment: fixed;*//*默认为scroll,当文档过长时,超过背景图片,图片消失.可设置为fixed*/
}
#p3{
text-align: center;/*text-align余<CENTER></CENTER>标签的区别:text-align只影响文本*/
text-indent:-4em;
padding-left: 5em;
}
p.p4{/*word-spacing:单词间隔 letter-spacing:字母间隔*/
word-spcing:30px;
text-transform: uppercase;/*字符转化(还可以首字母大写)*/
text-decoration: line-through;/*文字装饰*/
white-space:normal;/*处理空白符若设为pre空白符这不会被忽略*/
}
a:link{/*链接还未点击时*/
text-decoration:none;/*去掉链接下划线*/
background-color: red;/*改变链接背景颜色*/
}
a:visited{/*链接已被点击后*/
text-decoration:none;
background-color: yellow;
}
a:hover{/*鼠标移到链接上*/
text-decoration:none;
background-color: black;
}
a:active{/*链接正在被访问*/
text-decoration:none;
background-color:green;
}
ul{
/*list-style:url(2.jpg) circle inside;*/
list-style: circle inside;/*list-style:图片 图标 标志位置*/
}
table{
border-collapse: collapse;/*是否折叠为单一表单框*/
}
table,tr,td,th{
border:3px solid red;/*设置表单框*/
}
th{
background-color:deepskyblue;/*设置表头背景颜色*/
color: chocolate;/*设置文字颜色*/
}
.p5{
outline:#25D517 dotted ;/*设置轮廓*/
}
</style>
</head>
<body>
<p id="p1">这条语句的背景为粉色</p>
<p id="p2">这条语句的背景为图片</p>
<p id="p3">文本的缩进</p>
<p class="p4">the word spacing had changed</p>
<a href="http://www.baidu.com" target="_blank">点击这里链接到百度</a><br/>
国家:<br/>
<ul>
<li>中国</li>
<li>美国</li>
<li>日本</li>
</ul><br/>
<table>
<tr>
<th>学号</th>
<th>姓名</th>
<th>班级</th>
</tr>
<tr>
<td>161003530106</td>
<td>万涛</td>
<td>德泰1613</td>
</tr>
</table>
<p class="p5">设置轮廓</p>
</body>
</html>
标签:att 字符 cas :link back gre 设置 www 列表
原文地址:http://www.cnblogs.com/wantao/p/7881148.html