css 的页面布局

一 页面布局

1.1 页面布局

1 <div>块元素在没有任何布局属性作用时，默认排列方式是换行排列。

2.<span>: 内联元素的默认排列：在没有任何布局属性作用时，默认排列方式是在同行排列。

3.浮动元素：即float取3个值： auto、left、right，使用浮动之后，原本需要换行显示的块元素，实现了并排列的效果。

4.在css中，可以用text-decoration属性来控制文字的修饰样式。

5.在css中，定义页面中内容显示方式，display属性和visibility属性；其中visibility是否用来确定页面元素中 的属性显示

6.在<ul><li></li></ul>  中 list-style-type 属性用来定义li列表的项目符号，li显示相应的修饰内容。

7.css中清除浮动属性：clear； 垂直居中：可以用 line-height；

1.2 定位属性

1.定位属性：1定位模式，2 边偏移 3 层叠定位属性 z-index

绝对定位： position的值为 absolute；

相对定位：position的值为 relative；

固定定位： position的值为  fixed；

叠层定位： position的值为 具有相对性。

1.3 背景图片

backgroud-attachment  ：scorll  背景内容随内容滚动；  fixed  背景图像固定

1.4 连接

链接有4种状态： 1来访问态；2 鼠标悬停态  3 激活状态，4已被访问态

分别为： ：link； ：hover； ：active ；：visited ，一般都是在网页中使用链接a元素来实现。

1.5 float元素的使用

使用浮动属性将页面标题和地址定义为同行显示：

#title {float: left}  #url{ float: left}  #desc{clear:left; color:#fff}

1.6 css中overflow的作用

1.visible 默认值。内容不会被修剪，会呈现在元素框之外。

2.hidden 内容会被修剪，并且其余内容是不可见的。

3.scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。

4.auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。