前段時(shí)間在做公司的一個(gè)英語的Web項(xiàng)目，遇到了個(gè)小問題，問題描述如下：網(wǎng)頁上有一個(gè)層(div)，層里面的內(nèi)容后臺(tái)是可以修改的，有點(diǎn)類似于網(wǎng)站的公告或者通知的形式。這里的內(nèi)容是由客服MM修改的，她們習(xí)慣性的直接從word文檔里面復(fù)制過去，這樣復(fù)制過去問題就來了，由于后臺(tái)是使用的FCK編輯器，直接復(fù)制過去那個(gè)編輯器就會(huì)添加很多樣式，前臺(tái)界面這下可就亂套了，亂七八糟的。用Firefox選中后臺(tái)添加的公告內(nèi)容查看其源代碼，居然還有中文的：font-family:"@宋體"這種代碼，這樣子對(duì)于我們的網(wǎng)站是絕對(duì)不允許的，而且這段文本的格式也不是很好控制，搞得這個(gè)層里面的文字內(nèi)容左右都對(duì)不齊。后來把多余的樣式刪除掉了，但文本內(nèi)容在這個(gè)層里面的左右還是對(duì)不齊，沒有辦法，求助于公司的美工，美工幫我調(diào)了下樣式，但還是沒有完美的解決文本在這個(gè)層里面左右對(duì)齊并且首行縮進(jìn)，因?yàn)檎{(diào)了樣式之后在IE下OK了，但firefox下文本內(nèi)容還是沒有左右對(duì)齊并首行縮進(jìn)。這樣也不行，因?yàn)槲覀儾灰訧E為標(biāo)準(zhǔn)，以Firefox為標(biāo)準(zhǔn)，且是面向國(guó)外客戶的站點(diǎn)。這個(gè)問題我就暫時(shí)先放了一陣子，趕快把網(wǎng)站上線再說，一點(diǎn)小問題就沒有去管它了。 關(guān)于這個(gè)小問題呢，我也想到了 精通CSS與HTML設(shè)計(jì)模式 這本書的第11章介紹的分割這一節(jié)的文章有介紹，但這本書我也沒有放在公司，也就不管它了；今天翻起這本書也正好看到了，特把原來沒有解決的問題給解決掉了。 先看效果圖吧: 查看原圖（大圖） 其源代碼就比較干凈了,源碼如下: p Our online order form allows you to order directly in the internet, saving your time and offering you convenience. Here’s how you do it. /p p When you want to buy our commodities, please register first. After you create your account successfully, you can directly order our products and pay for them. Next time you just click “l(fā)og in”, you can enter your account, then shopping simply and conveniently. /p 最重要的就是CSS了,代碼如下: style type="text/css" *.elegant { margin-left: 40px; margin-right: 80px; letter-spacing: 1px; word-spacing: 2px; line-height: 1.7em; text-indent: 40px; text-align: justify; } /style 上面簡(jiǎn)單的html' target='_blank'>CSS樣式就實(shí)現(xiàn)了文本的左右對(duì)齊,并且段落的首行是縮進(jìn)的html教程
