CSS学习笔记01

CSS样式表
1.颜色:color:
RGB
#FFFFFF:全亮,白色;
#F00=#FF0000,红色;
2.内嵌样式
<!--通过style属性来设置样式,这个样式是嵌套在标签中,可以称为内嵌样式,内嵌样式仅仅只是对当前标签有效,内嵌标签中的元素会把在style中的样式替换掉-->
<h2 style="color:#212267;text-decoration:underline;font-size:12px">这是我的第一个CSS文件</h2>
3.外部样式
<style type="text/css">
/*h2表示对页面中的所有的h2的标签都有效*/
h2{
background:#aa1222;
color:#fff;
}
</style>
4.外部链接样式
<link rel="stylesheet" type="text/css" href="css02.css"/>

样式表的效果:最有效的是内部样式,但嵌入到标签处,修改困难,其次是越接近该标签的样式,效果就按越近的地方呈现。
值得注意的是,对于样式表而言,后定义的会把先定义的样式表覆盖掉;

5 选择器
5.1 标签选择器 会对页面中的所有标签都有效
p{
color:#f00;
}
5.2 ID选择器 以#号进行获取,(获取id为xx的标签):可以对页面中某个标签进行样式的设置
#p2{
font-weight:bold;
text-decoration:underline;
}

5.3类选择器 用.来进行表示(获取标签中class=xxx的标签):可以选择页面中的一组标签,class=”xxx的一组标签
/** p.p1表示class为p1的p标签,类选择器*/
p.p1{
color:#54a;
font-size:16px;
}
p.p2{
color:#998733;
}

5.4 包含选择符(获取某个标签中的所有的子标签)
p标签不能包含div标签,块标签只能使用span,容器标签不能放
p div{

}
不管主标签内是一级含有div还是二级,只要主标签内有多少div标签,全执行样式


5.5 子对象选择符(获取某个标签的第一级子标签),仅为以及标签
/*子对象选择符,仅仅只针对div标签的第一级子对象*/
div>span{
background:#f0f;
}

5.6分组选择符(可以同时设定多个标签,使用逗号进行分割)
/*分组选择符,以下表示所有的id为d1或者p2的标签都是用该样式*/
#d1,p2{
font-size:20px;
}
独立用id,不唯一用class

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。