css讓文字不超過div的固定width和height

在製作DIV+CSS頁面時候我們常常會遇到文字超出固定的高度也叫內容溢出，等到我們做完整個頁面時候內容添加上了後，發現有些地方文字超過了邊框內容溢出，甚至文字跑出CSS設定的邊框線，如下圖：

首先我們設定類如：.STYLE1 { width:150px; height:80px;color: #000000; border:1px solid #FF0000;}，而文字我們也不知道需要多少個文字才剛好不超過設定的紅色邊框，結果文字或圖片大了就超過設定的BOX(CSS盒子)高和寬。

解決讓文字不超出CSS盒子的固定高寬我們只需要在此CSS類加入overflow:hidden;樣式即可，加入後CSS類：.STYLE1 { width:150px; height:80px;color: #000000; border:1px solid #FF0000;overflow:hidden;}效果即下圖：

這樣一來文字就將不會溢出超出設定固定的高和寬區。

說明：

Overflow是檢索或設定當對象的內容超過其指定高度及寬度時如何管理內容。

Overflow文法：

overflow : visible | auto | hidden | scroll

Overflow參數：

visible : 　不剪下內容也不添加捲軸。假如顯式聲明此預設值，對象將被剪下為包含對象的window或frame的大小。並且clip屬性設定將失效

auto : 　此為body對象和textarea的預設值。在需要時剪下內容並添加捲軸

hidden : 　不顯示超過對象尺寸的內容

scroll : 　總是顯示捲軸