css--之初级

1属性选择器

E[att]{} 对标签值为E,属性是att的全部标签进行设置.注:此处的E,能够是空,能够是标签,也能够是肯定标签的选择器如  .class值,#id值.而att是标签中的属性,通常是人为添加的没有什么特殊意义的,主要起识别做用.

E[att=val]{} 对标签值为E,属性是att,且其值是val的全部标签进行设置

2选择器的优先级

Css有继承设置,可是也有覆盖.因此出现了选择器的优先级.

注:有一些属性不能被继承,如:border,margin,padding,background等

Css的优先级基本规则是:1 行内式最高,2  id选择器  3   class 选择器  4  标签选择器

这些规则将数字符串逐位相加,就获得最终的权重,而后执行权重最大的,最后从上到下顺序执行

注:有!important声明的规则高于一切,如

Div{

Color:red!important

}即div标签中,字体是红色

3 css中对文本的操做

经过color对文本中的文字颜色进行设置

经过text-align对文本的水平位置进行设置,left是居左,right居右,center居中,justify实现两端对齐.注:它们的位置是至关于它们所在框的

4  css对背景的设置

经过backgroud设置背景

Background-color 设置背景颜色,background-image:url(‘’)设置背景图片,图片的地址放url中,Background-repeat 图片平铺满,background-repeat:no-repeat 图片不平铺满所在框,background:repeat-x,把所在框的横向铺满,repeat-y纵向铺满

Background-position背景图片相对于框中的位置,background-position:right  top 表示图片的位置是在右上角,还能够是background-position:20px 10px,图片的位置在离左边框20px,离上边框10px的位置.

注:它们能够简写:background:#ffffff  url(‘1.png’)  no-repeat  right top   表示背景颜色是红色,背景图片是1.png 图片没有平铺满,只有一个图片,图片在所在框的右上角

5  display属性    它的做用是对标签是否显示和对块级与内联的进行转换,

Display:none  隐藏某个元素,且让隐藏的元素不占任何空间

Display:block  把内联转换成块级,让它独占一行

Display:inline  把块级转换成内联,让它不用独占一行

Display:inline-block  ,让标签具备能设置范围,但不独占一行

注:块级标签独占一行,同时能设置范围,即宽和高.内联标签不独占一行,可是不能设置范围

Display属性最重要的是Display:none和Display:inline-block,其中inline-block可作列表布局,其中的相似于图片间的间隙小bug能够经过以下设置解决:

Div{

Border:3px   dashed; 边框3px粗,是实线

Word-spacing:-5px; 调整图片之间的距离

}