day05

颜色的常见取值:

rgba(a为透明度)

0为完全透明,1为完全不透明

十六进制的颜色:

取值:数字:123456789 字母:abcdef

写法: # xx xx xx

简写:三组中,每一组都有相同的数字,可两个简写为一个

##aabbcc简写为#abc+

text-align:center:浏览器在识别一行排列多个的标签的时候,浏览器会把他们当作文字来识别.

背景相关属性:

默认在标签水平垂直范围平铺占满

路径的引号可以省略

背景图片的显示优先级高于背景颜色

背景图片不能撑开标签的范围,是用来修饰标签范围的

背景图片的----平铺

背景图片的---位置

 百分比表示图片位置:(大盒子减去图片的宽或高)*百分比,就是背景图片的移动距离

属性值之间,空格隔开

背景图片的大小:

background-size:数字+px    数字+px;

第一个代表宽,第二个代表高

百分比:占当前标签的内容宽高的宽高(也就是说受怪异盒模型影响)

背景图片的固定:

背景图片会随着内容的滚动而滚动,前提是设置溢出隐藏的相关属性auto

背景连写:

背景的连写取值不分先后顺序,单独书写一组数字+px单位的取值,代表背景的位置,/后面的一组数字+px代表图片的大小.

当单独属性碰到背景连写的时候,单独属性一定要放到连写的后面,避免被层叠.

宽高自适应:

给body,和html添加高100%,宽100%

背景图片填满标签

视觉差效果:

精灵图:

使用精灵图调整位置的时候,取值永远是负值.

修改列表项类型:

修改列表项图片:

相对定位：

特点:1.相对于自己原本的位置进行移动

          2.需要配合方向词移动（相对方向的方向词同时出现，优先执行left，top）

使用场景：标签位置的微调