CSS技巧学习总结
div自身居中
使用margin:0 auto
上下為0，左右自適應(yīng)的css樣式。
要讓div水平居中，那么除了設(shè)置css margin:0 auto外，還不能再設(shè)置float，不然將會導(dǎo)致div靠左（設(shè)置float:left）和div靠右（設(shè)置float:right）。
========
div內(nèi)的內(nèi)容居中
內(nèi)容居中分為div內(nèi)容水平居中與div內(nèi)容垂直居中。
div內(nèi)容居中，只需要設(shè)置一個內(nèi)容居中css（text-align:center）、內(nèi)容垂直居中（line-height）即可。
1、div內(nèi)容水平居中
CSS：
text-align:center
無論是p還是div都可以對其設(shè)置此CSS實(shí)現(xiàn)對應(yīng)對象內(nèi)的內(nèi)容水平居中。
2、div內(nèi)容垂直居中?
行高屬性：
line-height
要讓div內(nèi)只有一行的內(nèi)容垂直居中，通常對div設(shè)置的height(高)與line-height(行高)相同，即可實(shí)現(xiàn)div內(nèi)容垂直居中。
========
css怎么讓div在div中居中
讓div在div中居中，需要居中的div設(shè)置margin:0 atuo即可（當(dāng)然也不要設(shè)置float）。
========
使用CSS如何讓兩個div并排顯示
默認(rèn)情況下DIV是獨(dú)占一排的，DIV不設(shè)置任何CSS樣式，這個DIV盒子都會獨(dú)占一行自動換行。
使用CSS讓兩個DIV并排顯示，排成一排顯示常見方法有兩種：
1、使用display:inline
2、使用float
一、使用display:inline
對div設(shè)置display:inline即可實(shí)現(xiàn)div不換行，而是并排顯示，不會獨(dú)占一排。
示范代碼：
<style>?
div{ display:inline}?
</style>?
?......
<body>?
<div>內(nèi)容1；內(nèi)容1；</div>?
<div>內(nèi)容2；內(nèi)容2；</div>?
</body>?
使用display:inline，其實(shí)是去掉了div默認(rèn)display:block（塊 獨(dú)占一行 對象換行）屬性。
二、css 浮動 float讓兩個div并排顯示
float:left或float:right，靠左和靠右可以讓DIV失去默認(rèn)獨(dú)占一行屬性，所以使用float可以讓div并排顯示。
示例代碼
<style>?
div{ float:left}?
</style>?
<body>?
<div>內(nèi)容1；內(nèi)容1；</div>?
<div>內(nèi)容2；內(nèi)容2；</div>?
</body>?
三、div并排總結(jié)
div并排很多時候用到，比如左右結(jié)構(gòu)DIV布局，一般采用float設(shè)置靠左和靠右，如果多個DIV并排而不使用float，可以采用display:inline實(shí)現(xiàn)div不換行。
========
讓文字不超過固定寬度和高度
在制作DIV+CSS頁面時候，會遇到文字超出固定的高度，內(nèi)容溢出。
設(shè)置類如：.STYLE1 { width:150px; height:80px;color: #000000; border:1px solid #FF0000;}，文字不知道需要多少個文字才剛好不超過設(shè)置的紅色邊框，結(jié)果文字或圖片大了就超過設(shè)置的BOX（CSS盒子）高和寬。
解決讓文字不超出CSS盒子的固定高寬，只需要在此CSS類加入overflow:hidden;樣式即可，加入后CSS類：.STYLE1 { width:150px; height:80px;color: #000000; border:1px solid #FF0000;overflow:hidden;}
這樣文字就將不會溢出超出設(shè)置固定的高和寬區(qū)。
Overflow是檢索或設(shè)置當(dāng)對象的內(nèi)容超過其指定高度及寬度時如何管理內(nèi)容。
Overflow語法：?
overflow : visible | auto | hidden | scroll
Overflow參數(shù)：?
visible : 不剪切內(nèi)容也不添加滾動條。假如顯式聲明此默認(rèn)值，對象將被剪切為包含對象的window或frame的大小。并且clip屬性設(shè)置將失效
auto : 此為body對象和textarea的默認(rèn)值。在需要時剪切內(nèi)容并添加滾動條
hidden : 不顯示超過對象尺寸的內(nèi)容
scroll : 總是顯示滾動條
========
?
總結(jié)
- 上一篇： 使用纯 Win32 API 编程实现Wi
- 下一篇： CSS父级子级学习总结