css教程與代碼索引

1、CSS(CadingStyleSheets)簡介簡介在學在學CSS之前之前學習CSS之前，首先應學會寫HTML。如果你對HTML還一無所知，請參見HTML教程。CSS(CadingStyleSheets)簡介簡介當初一幫技術人員想出HTML，主要側重于定義內容，比如表示一個段落，表示標題，而并沒有過多設計HTML的排版和界面效果。隨著Inter的迅猛發(fā)展，HTML被廣泛應用，上網的人們當然希望網頁做得漂亮些，因此HTML排版和界面效果的

2、局限性日益暴露出來。為了解決這個問題，人們也走了不少彎路，用了一些不好的方法，比如給HTML增加很多的屬性結果將代碼變得很臃腫，將文本變成圖片，過多利用Table來排版，用空白的圖片表示白色的空間等。直到CSS出現。CSS可算是網頁設計的一個突破，它解決了網頁界面排版的難題?？梢赃@么說，HTML的Tag主要是定義網頁的內容(Content)，而CSS決定這些網頁內容如何顯示(Layout)。CSS的英文是CadingStyleSheet

3、s，中文可以翻譯成串聯(lián)式樣式表。CSS按其位置可以分成三種：?內嵌樣式(InlineStyle)?內部樣式表(InternalStyleSheet)?外部樣式表(ExternalStyleSheet)內嵌樣式內嵌樣式(InlineStyle)InlineStyle是寫在Tag里面的。內嵌樣式只對所在的Tag有效。這個Style定義里面的文字是20pt字體，字體顏色是紅色。顯示示例內部樣式表內部樣式表(InternalStyleSheet

4、)內部樣式表是寫在HTML的里面的。內部樣式表只對所在的網頁有效。H1.mylayoutbderwidth:1bder:solidtextalign:centercol:red這個標題使用了Style。這個標題沒有使用Style。顯示示例CSS語法語法基本語法基本語法一個樣式(Style)的語法由三部分構成：(中文叫選擇器有點怪怪的，就用英文吧)，屬性(Property)，屬性值(Value)。property:value舉個例子，下面

5、的代碼p就是，col就是屬性，blue就是屬性值。pcol:blueHTML中所有的Tag都可以作為。注：如果你想為注：如果你想為Style加多個屬性，在兩個屬性之間要用分號加以分隔。加多個屬性，在兩個屬性之間要用分號加以分隔。下面的Style就包含2個屬性，一個是對齊方式居中，一個字體顏色為紅，當中用分號分隔開。ptextalign:centercol:red為了提高Style代碼的可讀性，你也可以分行寫：ptextalign:cen

6、tercol:blackfontfamily:arial組合組合(Grouping)你也可以將相同的屬性和屬性值賦予多個。之間用逗號分隔之間用逗號分隔。h1h2h3h4h5h6col:red上面的例子是將所有正文標題(到)的字體顏色都變成紅色。Class利用Class，你可以用同樣的HTMLTag構成不同的樣式。比如說，你希望段落有兩種樣式，一種是居中對齊，一種是居右對齊。你就可以寫如下樣式：p.righttextalign:right