HTML、CSS总结(三)

background:背景的通用写法 

 

background-color:背景颜色,支持color:#fffff6个编码相同可以简写为3

color:rgba(0,0,0,1.00)rgba基准色编码,4个参数前3个参数控制颜色编码,最后一个参数是控制透明度(0-1之间)。

background-image:背景图片

background-repeat:背景平铺no-repeat不平铺,repeat平铺(默认值),repeat-xX方向平铺repeat-y Y方向平铺

background-size:背景的尺寸大小,

background-size:100% 100%;把图片拉扯到与盒子高度宽度一样大小;

 

backgrond-position: -x坐标 –y坐标;只需要加载背景一部分背景时使用,可控制具体在背景的某个坐标开始加载背景

border:边线控制的通用写法

border:1px solid #666

border-left,border-right,border-top,border-bottom

border-radius:圆角边框,属性就一个值,当值大于盒子高度或宽度一半时,变成圆形。

clear:清除浮动clear:both 上下两侧清除浮动

line-height:文字的行高,每一行文字占用的高度。文字永远保持在行高垂直方向上的中间。

heightwidth:元素的高度和宽度,某些行内元素不支持高度和宽度,<span><span><a></a>,当遇到不支持控制高度的元素时,可以用display:block转换为块级元素。

 

display:block 显示为块级元素

display:inline 显示为行内元素

display:inline-block显示为行内块级元素。

opactiy:0-1之间的值,元素的透明度,但该属性会控制到内部元素的透明度,如果只想控制本身元素的透明度,必须使用ragb颜色控制。

 

z-index:在非标准流,就是使用过position属性的盒子才支持,解释:图层重叠顺序,值越大,就在最上层,值越小在最底层。支持负值。

text-align: center 居中,left,向左对齐,right向右对接

 

行内元素横向对齐方式:text-aligncenter;一定用在父级盒子上

 

块级元素横向对齐:margin:0 auto,使用的前提是居中的盒子宽度要设置小于父盒子的宽度,使用时该属性用在控制的元素上

text-transform:文字大小写切换。uppercase转换为大写,lowercase转换为小写

word-break:break-all控制英文以父级宽度换行。


回到

顶部