CSS（中）
常用属性
1、背景
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
p{
background-color: aqua;
width: 800px;
height: 600px;
background-image: url(img/bg.jpg);
background-repeat: repeat-x;
background-size: 400px;
background-position: right top;
}
</style>
</head>
<body>
<p>诗和雪缴缠</p>
</body>
</html>
2、列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
li{
list-style-type: none;
list-style-image: url(img/img.jpg);
list-style: none url(img/img.jpg) inside;
}
</style>
</head>
<body>
<ul>
<li>这是列表项</li>
<li>这是列表项</li>
<li>这是列表项</li>
<li>这是列表项</li>
</ul>
</body>
</html>
3、伪类
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
a{
color: black;
}
a:hover{
color: blue;
}
a:active{
color: red;
}
.txt:focus{
background-color: #FF0000;
}
</style>
</head>
<body>
<a href="../">百度</a>
<a href="../">百度</a>
<a href="../">百度</a>
<input type="text" class="txt"/>
</body>
</html>
4、透明度
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
img:hover{
opacity: 0.5;
}
</style>
</head>
<body>
ssd
<img src="img/photo.jpg" >
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
