首页 > 技术文章 > 从基础复习前端html--8.css高级

xmg0513 2018-03-13 18:59 原文

1.css水平对齐

1)、使用margin属性来水平对齐,可通过将左和右外边距设置为"auto"来对齐块元素。

注释:除非应经声明了!DOCTYPE,否则使用margin:auto在IE8以及更早版本是无效的。在ie5中有个BUG,使用text-align:left;属性来解决这个BUG。

2)、使用position属性进行左和右对齐(absolute使用绝对定位)

注释:绝对定位元素会被从正常流中删除,并且能够交叠元素。

3)、使用float属性来进行左和右对齐

当使用float属性时,如果省略!DOCTYPE声明,ie8以及更早的版本会在右侧增加17px的外边距,声明了就没有。

2.css尺寸

height,设置元素的高度;line-height,设置行高;max-height,设置元素的最大高度;min-width,设置元素的最小宽度等等。

3.css分类属性

1)、display,设置是否及如何显示元素,值none(元素不被显示)、block(元素显示为块级元素)、inline(元素被显示为内联元素)、inline-block(行内块元素)。

2)、float,定义元素在哪个方向浮动,浮动元素会生成一个块级框,不论它本身是何种元素,值none(默认值,元素不浮动)、left(左)、right(右)。

3)、position,定位元素的位置,static(默认值,没有定位)、relative(相对定位,相对于其正常位置定位)、absolute(绝对定位,相对于static定位以外的第一个父元素定位)、fixed(绝对定位,相对于浏览器窗口定位)。

4)、clear,设置一个原始的侧面是否允许其他的浮动元素,值none(默认值,允许浮动)、left(左侧不允许浮动)、right(右侧不允许浮动)、both(左右两侧均不允许浮动)。

5)、visibility,设置元素是否可见或不可见,visible(默认值,元素是可见的)、hidden(元素不可见)。

6)、cursor,规定当指向某元素之上时显示的指针类型,值auto(默认,浏览器设置的光标)、url(自定义光标)、default(默认光标,通常是一个箭头)、pointer(光标呈现指示链接的指针一只手)、crosshair(十字线)、move(此光标指示某对象可以移动)、text(此光标指示文本)、wait(此光标指示程序正忙通常是一只表或沙漏)、help(此光标指示可用的帮忙,通常是一个问号或一个气球)。

 4.css导航栏

导航栏=链接列表,用ul、li元素非常合适。给li元素float:left;水平排列。

5.css图片库

<img src="/i/images/car.jpg" alt="car" width="160" height="160" / >

6.css图像透明度

定义透明效果的css3属性是opacity:0.4;值为0.0到1.0,值越小越透明。IE8以及更早版本使用滤镜filter:alpha(opacity=x),x能够取的值从0到100,值越小越透明。

 

推荐阅读