css基础知识4

1.定位

position:
    属性值  static   静态定位(默认值)  没有使用任何定位时的位置
           relative  相对定位  
            absolute  绝对定位
            fixed  固定定位
相对定位:
   属性值   left     top     right    bottom
 每个值变换的值都是相对于这个值没有声明之前的位置的偏移.
 相对定位并没有脱离文档流, 所以, 当一个元素相对定位之后, 不会影响其他的元素的位置.
 若是left和right同时设置,执行left
 若是top和bottom同时设置,执行top
 
 
绝对定位
    position:absolute;在你想要定位的元素那写下这句话
    然后在你想相对哪个元素进行绝对定位,便在哪个元素那开启定位,一般是填写 position:relative;那个元素便是定位元素的包含块.
    每个定位元素都要有一个包含块,如果没有设置,便默认为初始包含块HTML/body,根据浏览器不同默认也不同.
    包含块是离定位元素最近的祖先元素.
    对left, top...值的总结:  是定位元素的margin的外边缘, 距离包含块(参考父容器)的边框的内边缘的距离
    
    
    
    
 固定定位
 position:fixed;
     包含块为浏览器视窗.
    
    
​

2.背景

1. background-color 
2. background-img
   - 值是一个图片的url地址.
   - 背景图片没有的地方, 才会有背景颜色.
3. background-repeat
   - 设置背景的图片在元素中的重复的模式.
4. background-position
   - 表示背景图片在x,y方向的偏移量.
   - 如果只写一个值: 表示x的偏移量y方向会居中.
   - left, top, right, bottom, center
5. 简写属性:
   -background : 背景色 图片的url 是否重复 位置;
​

3.颜色值

三原色  红 绿  蓝
1.十六进制法
范围在0~9 A~F
#rrggbb
2.十进制法
0~255
rgb(*,*,*)
3.rgba十进制带透明度的颜色 (alpha通道)
color : rgba(100, 200, 200, 0.3);
a:alpha 透明度
0-1 0表示完全透明, 1表示完全不透明
4.英文表示
red  green...

猜你喜欢

转载自blog.csdn.net/qq_38514863/article/details/81174321
今日推荐