CSS

前面的學習我們僅僅使用HTML選取器（在HTML頁面裡為html標籤，如 P）　　現在我們學習使用clss和id定義屬於自己的選取器。　　這樣，同樣的html元素可以通過class或ID使用不同的表現。　　在CSS裡，使用點號（.）建立class選取器，使用hash符號（#）建立ID選取器。　　例子：  代碼如下複製代碼

　　　　我已經習慣了做好頁面之後去解決不同瀏覽器的相容性問題，不斷的測試，不停的修改CSS hack以保證在大部分的瀏覽器上得到最佳效果。光IE就需要兼顧IE5.X與IE6，以後也許還要為IE7來寫單獨的CSS hack，或許是這樣的工作做得多了開始討厭這樣的沒有效益的勞動。就是為了去滿足那些少數的IE5.0使用者或是為了滿足那些極端的Firefox或是 Opera的推崇者們，我需要花費多一倍的時間來研究這些，我開始思考當瀏覽器不斷成長，不斷更新，我們的CSS&nb

你應該已經在HTML初級教程的綜合中創作了一個HTML文檔，而且在CSS初級教程的的開始中增加了一行，用以把HTML文檔和CSS文檔聯絡起來。下面的程式碼封裝括了所有我們在初級教程中所學習的方法。只要你把下面的儲存起來作為CSS文檔，然後在瀏覽器中查看HTML文檔，你就可以理解每一個CSS的屬性的表現和怎麼應用。最好的方法就是花費時間修改CSS文檔和HTML文檔上的代碼，然後在瀏覽器中查看到底發生了什麼。  代碼如下複製代碼

虛擬元素（pseudo elements）跟偽類一樣吮吸選擇符，使用selector:pseudoelement { property: value; }的形式。有四個吮吸器。首字和首行首字first-letter 虛擬元素應用到元素的第一個字，而首行first-line則是元素的頂行。你可以，比如，建立一個首行粗體和首字下沉的段落，像這樣：  代碼如下複製代碼

CSS屬性：4、顏色和背景（Color and Background）屬性：這裡介紹有關CSS中前景色彩和背景顏色、圖片的設定方法。color屬性：color屬性用於設定元素的前景色彩：屬性名稱: 'color'屬性值: <color>初始值: 根據使用者的初始值而定適合對象: 所有元素是否繼承: yes百分比備忘: 被禁止color屬性的值可以是十六進位數值、rgb()函數或CSS承認的顏色名稱。如：EM { color: red }EM { color: rgb(255,0,0)

CSS屬性：8、表格屬性：由於表格中的大部分屬性已經在以上的各類屬性中探討過了，所以這裡只有兩個屬性介紹：row-span屬性描述表格跨越的行的數目：屬性名稱: 'row-span'屬性值: <integer>初始值: 1適合對象: 表格元素是否繼承: no百分比備忘: 被禁止column-span屬性描述表格跨越的列的數目：屬性名稱: 'column-span'屬性值: <integer>初始值: 1適合對象: 表格元素是否繼承:

　　不怎麼多，但是我覺得很有用，以前寫的了，不過看到網友們做個人網站的時候都不怎用CSS，這是不對滴，樣式表是基礎的東東，如果不想別人把你看成小菜，那還是要用用樣式表 　　一，CSS的管理 　　偶個人感覺比較重要，而且網上好像也比較少有說這方面的 ，一來管理好的話，在調用和定義CSS時，會省掉很多時間和麻煩，以下是偶的一些積累............... 　　首先是為何要外部匯入或連結CSS

　　overflow、overflow-x、overflow-y屬性可以用於管理超過其容器大小的內容，例如:<body style="overflow-x:

　　CSS與JavaScript結合起來產生的特效，進一步領略到CSS的強大功能。　　動態改變樣式　　我們先來看一個較簡單的特效，這裡只是用到了屬性和滑鼠事件。　　我們使用“class”類屬性來改變文檔的樣式。　放大這段文本。　　這個例子的代碼是這樣的：　  代碼如下複製代碼 　<html>　　<head> 　　<title>change style</title> 　　<style>

　　　　在CSS中，繼承是一種非常自然的行為，我們甚至不需要考慮是否能夠這樣去做，但是繼承也有其局限性。　　首先，有些屬性是不能繼承的。這沒有任何原因，只是因為它就是這麼設定的，標準就是如此。舉個例子來說：border屬性，大家都明白border屬性的作用是設定元素的邊框的，它就沒有繼承性。如果繼承了邊框屬性，那麼文檔看起來就會很奇怪。例如我們定義容器div的邊框為1px，而在此容器內的ul li在正常情況下我們都不希望它有邊框，如果border有繼承性，我們就要再去掉它們的邊框。這樣

　　CSS2盒模型　　CSS2中的盒模型是關係到設計中排版定位的關鍵，任何一個選擇符都遵循盒模型規範，例如<div>、<p>、<a>……盒模型包含(外補丁)margin，(背景顏色)background-color，(背景圖片)background-image，(內補丁)padding

CSS布局提倡者的聲音正被"表格版面配置的優點"的聲音所覆蓋。一個荒誕的說法是CSS是難學的。事實上，CSS一點也不比其他網頁技術難。問題在於：對於表格設計已經相當有經驗的web設計師不得不完全放棄他們的思維模式改用CSS方法。我曾經用表格版面配置設計過許多年，當我第一次開始使用CSS布局時，我也遇到了問題。"用表格多簡單呀"我想。但是，那隻是因為我已經用慣了表格，我知道如何巧妙的處理它們。任何改變，哪怕是小小的一點，都會讓我覺得麻煩，更不用說這麼激烈的變化。回憶起我第一次學慣用表格版面配置，同

　　本CSS Hack代碼範例，可以直觀顯示各個版本瀏覽器hack的使用。相容IE5.0、IE5.5、IE6.0、IE7.0、FF1.5、FF2.0。　　IE7.0簡體中文正式版發布了，對於我等常和網頁打交道的人來說網頁相容性問題也隨之而來了。IE7.0有一個顯著的改變就是支援!important了，是件好事情，但是也給廣大的在IE6時代使用!important來區分處理IE和FF的網頁製作者帶來了不少問題，Noker也遇到了這個問題，所以翻閱網上資料，寫了下面這個能夠相容現今大多數主

先聲明，是偶的同事xpoint遇到的，不是偶首發的。不說這句話偶肯定挨揍...當ID與Class組合使用的時候在IE6下無法正常顯示。CSS代碼：  代碼如下複製代碼

CSS繼承性在應用中存在，那麼在樣式表中可能會有些讀者搞不清，多個樣式表同時應用到一個元素對象上會發生什麼情形呢？先舉個簡單的例子，請運行下面的代碼：CSS網頁布局 - 　　 [ 可先修改部分代碼 再運行查看效果 ]　　我們會看到啟動並執行效果：因為選擇符h1和.aaa都匹配上面的h1元素，那麼到底瀏覽器會應用哪一個呢？通過在瀏覽器中觀察，我們發現這段文字應用了.aaa這個樣式，所以它顯示的是紅色。這是因為兩條規則的特殊性不一樣，CSS規則必須這樣進行處理。而字型的大小，卻是h1預設的大小。　　

提示：您可以先修改部分代碼再運行 div+CSS的無限級擴充下拉式功能表我是菜單1 一一一級 01一一一級 02第222菜單 01第222菜單 0233333333_0133333333_024444級菜單裡的014444級菜單裡的02這個是第五級菜單33333333_03第222菜單 03第222菜單 04一一一級 03一一一級 04一一一級 05我是菜單2遊戲業務部遊戲開發組遊戲事業部海外事業部我是菜單3 商業技術合作網 站 合 作客戶服務中心我是菜單4公 司 動 態發 展 曆 程開 發

提示：您可以先修改部分代碼再運行 純CSS菜單 首頁 最新更新 下載排行 ASP 企業整站 圖片相簿 社區程式 PHP 部落格微博 論壇社區 JSP 企業 新聞系統 留言 VC++ 資料庫 介面 加密 DELPHI 系統相關 演算法 資料庫 提示：您可以先修改部分代碼再運行

提示：您可以先修改部分代碼再運行 css+table作柱形統計表 基於table的柱狀圖實現——dudo部落格 某公司2007年1~4季度南北地區銷售情況對照表（單位：萬件）北方南方Q11816Q23234Q34332Q41832 50 40 30 20 10 提示：您可以先修改部分代碼再運行

最近兩天在做Ghost的主題Adam。我的部落格是跑在境外伺服器上的，所以為了訪問速度快點，啟用gzip壓縮是必不可少的。vim /etc/nginx/nginx.conf找到類似如下代碼：gzip ongzip_types text/plain改為如下即可：gzip on;gzip_buffers 4 16k;#gzip_http_version 1.1;gzip_types text/plain application/x-javascript text/css

提示：您可以先修改部分代碼再運行 js+css滑鼠經過背景變色的雙邊框圖片展示效果與之間-->與之間--> 圖片一 圖片二 圖片三 提示：您可以先修改部分代碼再運行