1:div css 之 定位 position
一般情况下 position需要与
top left right bottom 来配合使用
position:
relative 相对定位 相对自身位置的定位
保留自身的位置
absolute 绝对位置定位 top: left : riaght: button:
相对于父级的定位(
top: left : riaght: button:后跟的属性是相对与父级 下方开始定位
父级必须有position的属性
如果父级没有 继续往父级的父级 。。。body)
不保留自身的位置
fixed 固定位置的定位 相对于浏览器的位置
z-index 层叠顺序 一般要与position配合使用
2:样式选择器
1:行内样式
2:内部样式(不会马上生效 需要引用)
<head>
<style type="text/css">
标签名{属性1:值1;.......属性n:值n;}
</style>
</head>
a:标签选择器
标签名{属性1:值1;.......属性n:值n;}
页面中只要碰到这个标签自动会套用该样式
b:类选择器
1: .类名{属性1:值1;.......属性n:值n;}
2:需要引用才能有效果
<tag class="类名"></tag> tag代表一个html标签
可以重复使用
c:id选择器
1: #id名称{属性1:值1;.......属性n:值n;}
2:在需要的地方引用才能有效果
<tag id="id名称"></tag> tag代表一个html标签
一个页面中 id名不要重复引用
d:后代选择器
标签名 子标签名{属性1:值1;.......属性n:值n;}
.类名 标签名{属性1:值1;.......属性n:值n;}
.类名1 .类名2{属性1:值1;.......属性n:值n;}
#id名 .类名 标签名{属性1:值1;.......属性n:值n;}
e:子选择器
标签名>子标签名{属性1:值1;.......属性n:值n;}
.类名>标签名{属性1:值1;.......属性n:值n;}
#id名>类名{属性1:值1;.......属性n:值n;}
f: *{} 通配符选择器
通配符选择器优先级< 标签选择器优先级
< 类选择器优先级 <id 选择器的优先级<行内样式