1.text-indent:2em:空两格
1 em = 1 font-size = 16px
2.text-decortion:underline:下划线
网址:color : rgb ( 0 , 0 , 238 )
3.cursor:pointer:光标移动到此处时变成手指
4.cursor:help:光标移动到此处时变成问号
5.cursor:e/w-resize:向右/上边框放大
copy丨move丨……
6.选择器 : hover:伪类选择器(光标移动到此处时才会发生变化)
<a href="www.baidu.com">www.baidu.com</a>
<a href="www.taobao.com">www.taobao.com</a>
<a href="www.jd.com">www.jd.com</a>
/*注意权重大小*/
a{
text-decoration:none;
}
a:hover{
text-decoration:underline;
background-color:#f40;
color:#fff;
font-size:16px;
font-weight:bold;
font-family:arial;
border-radius:10px;
}
总结(CSS特性)
分类 | 行级元素、内联元素(inline) | 块级元素(block) | 行级块元素(inline-block) |
---|---|---|---|
feature | 内容决定元素所占位置 不可以通过CSS改变宽高 | 独占一行 可以通过CSS改变宽高 | 内容决定大小 可以改宽高 |
标签 | span strong em a del | div p ul li ol form address | img |
凡是带有inline 的元素,都具有文字特性
7.先定义功能
<body>
<div class="red size1"></div>
<div class="green size2"></div>
<div class="gray size3"></div>
</body>
.red{
background-color:red;
}
.green{
background-color:green
}
.gray{
background-color:gray;
}
.size1{
width:100px;
height:100px;
}
.size2{
width:200px;
height:200px;
}
.size3{
width:300px;
height:300px;
}
8.*{}:通配符可以初始化所有标签