直接用CSS+XML排版

這篇文章可以看作是上一篇《談一下XHTML網頁製作》的內容為核心的介面與版式分離觀點繼續，也可以當作只是奇巧淫技的一種展示。 P.S：如果想跟著一起做，請先安裝Firefox（以下簡稱FF）瀏覽器，因為IE對CSS的標準支援不夠完善。 XML文檔，我們採用RSS的格式，這樣大家也比較熟悉，你可以任意找一個RSS檔案來做這個練習：） 首先，在你的RSS檔案裡加入 <?xml-stylesheet type="text/css" href="style.css"?> 如所示： 此主題相關圖片 在FF中顯示效果如下： 此主題相關圖片 非常的雜亂無章，好了，我們先寫下一句CSS，讓他們都區分開來： *{     display:block; } 效果： 此主題相關圖片 好了，接下來在Faridea RSS那個位置我們想換成我們的LOGO，寫下如下CSS： channel >title:before{     content:url("images/logo.gif"); } 此主題相關圖片 你現在肯定開始為LOGO後面多餘的Faridea RSS頭疼了吧，怎麼去掉他？把他的顏色改的和背景一樣就是了：），抱歉使用這種奇巧淫技 好了，接下來，我們按照設計圖加上背景色，設定字型，把不想顯示的資料none掉，加入類似如下代碼，放心全部的代碼我會打在附件中。 channel{     background-color:#D9C4A6;     font-size:9pt; } channel >title{     color:white;     width:777px;     margin-left:auto; margin-right:auto;     /*background-color:white;*/     background:#FFFFFF url(images/top_bg.gif) top no-repeat;     padding:20px 0px 0px 0px; } channel >generator{     display:none; } 最後效果 此主題相關圖片 好了，最後還是那句話，網站無論設計還是製作，都要以內容為核心。內容無論用HTML標籤包圍還是被XHTML包圍、還是XML包圍，這些都不重要，關鍵是合理的組織好他們，然後拿起CSS這個強大的武器去美化她：） End 全部代碼下載： 此主題相關檔案 155247.zip