div+css 之定位 position与样式选择器

来源：互联网发布：synchronization java 编辑：程序博客网时间：2024/06/05 04:14

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>

标签名{属性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 选择器的优先级<行内样式

0 0

div+css 之 定位 position与样式选择器

div+css 之定位 position与样式选择器