在用div+css做網(wǎng)站的過(guò)程中，常用要對(duì)一些內(nèi)容強(qiáng)制換行，有時(shí)又需要對(duì)一些元素強(qiáng)制不換行。那么有什么方法可以讓div+css中的內(nèi)容強(qiáng)制換行與強(qiáng)制不換行呢？
div+css中的內(nèi)容強(qiáng)制換行與強(qiáng)制不換行的代碼如下：
/* 禁止換行 */
.nowrap{word-break:keep-all;white-space:nowrap;}
/* 強(qiáng)制換行 */
.break{word-break:break-all;}
div+css中的內(nèi)容強(qiáng)制換行與強(qiáng)制不換行使用代碼需要注意的地方：
如果在div這類(lèi)標(biāo)準(zhǔn)塊級(jí)元素中需要強(qiáng)制換行，最普遍的方案那就是word-wrap:break-word; word-break:break-all;此方式的缺點(diǎn)就是會(huì)導(dǎo)致如果恰巧該行末端寬為一個(gè)長(zhǎng)串英文單詞，那么該單詞會(huì)被撕開(kāi)的尷尬樣式(而且FF不識(shí)別word-break，反而不會(huì)撕開(kāi)這個(gè)單詞)。個(gè)人認(rèn)為如果你這個(gè)div里面放的類(lèi)似于URL這個(gè)長(zhǎng)串地址，那么用此方案是非常不錯(cuò)的選擇（注意：由于FF不識(shí)別word-break，所以無(wú)法保證每行末端會(huì)整齊的斷開(kāi)URL單詞，但這也是無(wú)奈的選擇）。如果不是放置URL這類(lèi)可以斷開(kāi)的長(zhǎng)串英文，而是英文句子的話(huà)，那么使用word-wrap:break-word;即可。
實(shí)際使用中的代碼如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
#layout { width:300px; height:200px; margin:0 auto; background:#ddd;word-break:break-all;}
#layout a {word-break:keep-all;white-space:nowrap;}
</style>
</head>
<body>
<div id="layout"><a href="#">這是第一塊內(nèi)容</a> <a href="#">這里第二塊內(nèi)容</a> <a href="#">這是第三塊內(nèi)容</a></div>
</body>
</html>