本节简介:讲解css样式的编写格式及标签选择器、类选择器、id选择器、编组选择器、后代选择器、通用选择器、后代选择器7种类型选择器的特征对比和编写格式
本节课同学们做的笔记 点击播放按钮可自动定位到对应时间进行播放
css样式规则 <style></style>标签内 h1{ color: backguang: fontsize: }
伪类选择器:a:hover:{属性1:值1;属性2:值2}。
通用选择器:*{属性1:值1;属性2:值2}。后代选择器: 父级选择器 后代选择器{属性1:值1;属性2:值2}。编组选择器:选择器1,选择器2{属性1:值1;属性2:值2}。
标签选择器:h1{属性1:值1;属性2:值2}。类选择器:.class 名{属性1:值1;属性2:值2}。ID选择器:ID是唯一的,在css样式中定义了id选择器,在html中只能用唯一一次格式:#id名{属性1:值1;属性2:值2}。
父级输入子级按tab键增加空格 1、标签选择器 2、类选择器 3、ID选择器 4、通用选择器:*{ 属性1:值1; } 对页面上的任意元素统一设置一样的样式 5、后代选择器:.父级 .子级:*{ 属性1:值1; }父级元素和子级元素需要空格隔开 6、编组选择器:选择器1,选择器2{ 属性1:值1; }选择器与选择器之间用逗号隔开 7、伪类选择器:a{color:blue;} a:hover{color:green;}在选择器的后面添加:hover 鼠标经过时属性发生改变
<style></style>标签必须写在<head></head>标签里
通用选择器*{} 标签选择器h1 div {}等 类选择器class .yun{} id选择器#yun{} 后代选择器 .yun .box{} 编组选择器h1,h2, .box{} 伪类选择器.box:hover{}
父级输入子级按tab键增加空格 1、标签选择器 2、类选择器 3、ID选择器 4、通用选择器:*{ 属性1:值1; } 对页面上的任意元素统一设置一样的样式 5、后代选择器:.父级 .子级:*{ 属性1:值1; }父级元素和子级元素需要空格隔开 6、编组选择器:选择器1,选择器2{ 属性1:值1; }选择器与选择器之间用逗号隔开 7、伪类选择器:a{color:blue;} a:hover{color:green;}在选择器的后面添加:hover 鼠标经过时属性发生改变
4.通用选择器,格式*{属性1:值1;属性2:值2;}
3.id选择器id是唯一的,在css样式中定义了id选择器,在HTML中hi能用唯一一次
2.类选择器(class选择器),通过给标签添加class名称。格式:.clsss名{属性1:值1;属性2:值2;}
1.标签选择器,直接书写标签的关键字,格式:h1{属性1:值1;属性2:值2;}
1.标签选择器(直接书写标签关键字)格式:h1{属性1:值1 属性2 “值2}<br> 2.类选择器(class选择器,通过给标签添加名称)格式:.class名{属性1:值1 属性2 “值2} <br>3.id选择器(id是唯一的,在css样式中定义了id选择器,在html中只能用唯一一次)格式:#id{属性1:值1 属性2 “值2}<br>4.通用选择器(可以对页面任意元素统一设置样式)格式:*{属性1:值1 属性2 “值2}<br>5.后代选择器 (父级
通用选择器:可以对页面上的任意元素同意设置一样的样式。