1.如何讓文字在容器內垂直居中？
(1)方法：為容器新增line-height屬性，使得line-height的值等於容器的height。
(2)**
[html]view plain
copy
?>
<
html
>
<
head
>
<
meta
charset="utf-8"
>
<
title
>無標題文件
title
>
<
style
type="text/css"
>
.container
.text
style
>
head
>
<
body
>
<
divclass="container"
>
<
pclass="text"
>我是文字
p>
div>
body
>
html
>
(3)原理
首先應該明確line-height的含義。line-height屬性的含義是設定行間的距離，簡稱叫行高。而文字的特點就是會以中線為基準進行顯示。也就是說，我們可以做如下實現：設定乙個容器div，不為其制定高度，內部的文字為其指定行高，在chrome中變換行高，我們會發現文字一直是在容器中垂直居中顯示的。（這裡的容器大小完全是被文字撐開的，準確的說是其line-height撐開的）
所以如果外部的div大小確定，將其內部的文字設定line-height為容器高度，從視覺效果上看就實現了文字的垂直居中。但還是應該注意並不是二者配合才生成的這種效果，而是文字本身的顯示是圍繞中線居中的。
2.如何實現三列布局，兩側固定寬度中間自適應？
(1)方法：利用浮動，分別對左右兩側的div設定向左右兩側浮動，再為中間的div設定相應的margin
(2)**
[html]view plain
copy
?>
<
html
>
<
head
>
<
meta
charset="utf-8"
>
<
title
>無標題文件
title
>
<
style
type="text/css"
>
.container
.box
.left
.right
.middle
style
>
head
>
<
body
>
<
divclass="container"
>
<
divclass="box left"
>
div>
<
divclass="box right"
>
div>
<
divclass="box middle"
>
div>
div>
body
>
html
>
(3)原理
這裡利用了預設寬度的方法。乙個div，如果不為它設定寬度，那麼它的寬度預設值就是100%。也就是說如果父元素寬度是當我們在此基礎上為其設定margin-left和margin-right屬性值，就會讓這個div的寬度相應縮小。
注意，height的預設值是0。
3.如何讓乙個div鋪滿整個螢幕
(1)方法：將背景圖寬度和高度設定為100%，並且設定position為fixed。
(2)**
[html]view plain
copy
?>
<
html
>
<
head
>
<
meta
charset="utf-8"
>
<
title
>無標題文件
title
>
<
style
type="text/css"
>
* .container
style
>
head
>
<
body
>
<
divclass="container"
>
div>
body
>
html
>
(3)原理如果只設定width和height為100%，那麼寬度可以達到100%，但是高度並不會發生變化。設定了position:fixed，其含義為生成絕對定位的元素，並且
相對於瀏覽器視窗進行定位。因此，這樣設定後，整個
container元素都是依據視窗進行設定的，高度的100%也就是相對於當前視窗大小的100%了。
CSS頁面布局技巧（一）
1 字型型別 絕大多數使用者系統預設支援的中文字型有宋體 黑體 幼圓 楷體 預設支援的英文本型有arial arial black arial narrow century gothic comic sansms times new roman等等。在使用中，宋體和arial使用頻率最高。css提供...
CSS技巧薈萃 了解CSS頁面布局和載入流程
如果你開發web相關應用或者 的話，肯定知道css對於頁面布局的重要性。在本篇css技巧中我們將介紹頁面載入的流程來幫助你更好的實現頁面布局。在我們開始正式的介紹頁面流程前，我們需要簡單了解幾種不同型別的html元素，以及它們的預設顯示方式。這裡我們主要重點介紹兩個型別的元素 如果大家關心html5...
CSS技巧薈萃 了解CSS頁面布局和載入流程
如果你開發web相關應用或者 的話，肯定知道css對於頁面布局的重要性。在本篇css技巧中我們將介紹頁面載入的流程來幫助你更好的實現頁面布局。在我們開始正式的介紹頁面流程前，我們需要簡單了解幾種不同型別的html元素，以及它們的預設顯示方式。這裡我們主要重點介紹兩個型別的元素 如果大家關心html5...