html 通常用来定义网页的结构,css主要控制网页的表现(样式)而javascript主要是行为
css层叠样式表(cascading style)
css结构 选择器 以及一条或多条声明:
h1 {clolr:blue; font-size:12px;}
css是什么?
css引用样式表的三种方式
外部引用有什么优点
如果三种样式表同时作用于一个元素,优先级谁高谁低
就近原则,谁离元素最近,就作用某一个样式。
层叠
多个样式表作用于同一个元素时,首先筛选有没有重复的属性,有的话就就近原则,没有重复就层叠为一套最终的样式最后作用在元素身上
网页放到浏览器 步骤
1网页-----html------dom树
2css-----css的规则
3把css的样式渲染到dom树上
4最后将渲染的dom树 显示出来
<>
设置属性如图
三个选择器写在head内部 然后在写style标签 写在style标签内部
css选择器
id选择器 :#号表示选中id属性,id对应的属性值! id是唯一的
#p1{
font-size:30px;
}
结果如图
元素选择器:针对页面上所有的元素
结果如图
class选择器:同一个类元素的相同样式 即在一个标签里面设置了id之后又设置class 这个 class可以重复 ,针对某一个元素设置多个class样式 用空格隔开。
.(点)class的值{
color:orange
}
如图
结果图
超链接顺序必须按照设置的顺序来
,如果把visited放在最后,执行完第一次以后就默认visited的样式
id 选择器不能选择数字开头,并且不能合并使用
id选择器和类选择器优先级
id选择器优先级大于类选择器优先级
类选择器大于元素选择器的优先级
此处优先级比对只在同一个style里面
选择器分组 某些元素有同样的css样式
.xx,.xx{
color:red;
}
通过属性和属性值选中元素
input [ name=username ] {
color:red;
}