CSS基礎(chǔ)知識(shí)篇
第1章、CSS初步體驗(yàn)
1、行內(nèi)樣式表的優(yōu)先級(jí)最高，其次是采用<link>標(biāo)記的鏈接式，再次是位于<style></style>之間的內(nèi)嵌式，最后才是@import的導(dǎo)入式樣式表。link和style的優(yōu)先級(jí)是一樣的,取決于誰(shuí)在前誰(shuí)在后，還要考慮優(yōu)先級(jí)加權(quán)的情況。籠統(tǒng)的說(shuō)link和style的優(yōu)先級(jí)誰(shuí)高誰(shuí)低是錯(cuò)誤的。
2、濾鏡漸變filter只在IE瀏覽器下有效，并且在IE7中必須將安全級(jí)別設(shè)置成Medium.
第2章、CSS的基本語(yǔ)法
2、標(biāo)記選擇器、類別選擇器、ID選擇器。聲明包含屬性和值兩部分。
3、在沒(méi)有定義選擇器的時(shí)候，各個(gè)HTML標(biāo)記采用瀏覽器自身默認(rèn)的顯示方式。
4、類別選擇器還有一種更直觀的使用方法：直接在標(biāo)記聲明后接類別名稱，以此來(lái)區(qū)別該標(biāo)記。類別名稱中包含標(biāo)記和選擇器。
5、在HTML標(biāo)記中，還可以同時(shí)給一個(gè)標(biāo)記運(yùn)用多個(gè)class類別選擇器，從而將兩個(gè)類別的樣式風(fēng)格同時(shí)運(yùn)用到一個(gè)標(biāo)記中。
6、ID選擇器的使用基本和類別選擇器相似，不同之處在于ID選擇器只能在HTML頁(yè)面中使用一次，因此針對(duì)性更強(qiáng)。一個(gè)id最多只能賦予一個(gè) HTML標(biāo)記。
7、集體聲明、嵌套聲明。類別選擇器和ID選擇器都可以進(jìn)行嵌套。還可以多層嵌套。
8、子標(biāo)記會(huì)繼承父標(biāo)記的所有樣式風(fēng)格，并可以在父標(biāo)記樣式風(fēng)格的基礎(chǔ)上再產(chǎn)生新的樣式。
第3章、用CSS設(shè)置豐富的文字效果
9、通常文章正文中使用的是易讀性較強(qiáng)的serif字體，用戶長(zhǎng)時(shí)間閱讀下不容易疲勞。而標(biāo)題和表格則采用較醒目的sans-serif字體，他們需要顯著和醒目，但不必長(zhǎng)時(shí)間盯著這些文字來(lái)閱讀。WEB設(shè)計(jì)及瀏覽器設(shè)置中也是推薦遵循此原則。
10、絕對(duì)單位及其含義
絕對(duì)單位 說(shuō)明
in Inch,英寸
cm Centimeter,厘米
mm Millimeter,毫米
pt Point,印刷的點(diǎn)數(shù)，在一般的顯示器中1pt相當(dāng)于1/72inch
pc Pica,1pc=12pt
11、除了利用物理單位設(shè)定文字的絕對(duì)大小的方法，css還提供了一些絕對(duì)大小的關(guān)鍵字作為font-size的值，總共7個(gè)：xx- small,x-small,small,medium,large,x-large,xx-large.絕對(duì)大小在不同的顯示器中顯示效果有差異，因此不推薦使用。
12、px顯示大小與顯示器的大小及其分辨率有關(guān)。采用“%”或者“em”都是相對(duì)父標(biāo)記而言的，如果沒(méi)有設(shè)定父標(biāo)記的字體大小，則相對(duì)于瀏覽器的默認(rèn)值。
13、文字效果可以同時(shí)賦值，只需用空格隔開(kāi)即可。
第4章、用CSS設(shè)置圖片效果
當(dāng)vertical-align的值為bottom或者sub時(shí)，IE與Firefox的顯示效果是不一樣的，所以建議盡量少使用瀏覽器顯示效果不一樣的屬性值。
第5章、用CSS設(shè)置網(wǎng)頁(yè)中的背景
豎排版語(yǔ)句“writing-mode:tb-rl”只有IE瀏覽器才支持，firefox瀏覽器并不支持該CSS屬性。
第6章、用CSS設(shè)置表格與表單的樣式
1、<table>標(biāo)記中的summary屬性值用于概括整個(gè)表格的內(nèi)容，在用瀏覽器瀏覽頁(yè)面時(shí)，它的效果是不可見(jiàn)的，但對(duì)搜索引擎等則十分重要。
2、在HTML頁(yè)面中構(gòu)建表格框架時(shí)應(yīng)該盡量遵循表格的標(biāo)準(zhǔn)標(biāo)記，養(yǎng)成良好的編寫(xiě)習(xí)慣，并適當(dāng)?shù)睦胻ab、空格和空行來(lái)提高代碼的可讀性，從而降低后期的維護(hù)成本。
3、通過(guò)CSS中定義奇數(shù)行和偶數(shù)行的樣式設(shè)置，增加易讀性，主要配合服務(wù)器的動(dòng)態(tài)生成。
4、各個(gè)瀏覽器的顯示差異主要是顯示器的默認(rèn)值不同導(dǎo)致的，通常的解決辦法是制定該值。
第7章、用CSS設(shè)置頁(yè)面和瀏覽器的元素
當(dāng)前激活狀態(tài)“a:active”一般顯示的情況非常少，因此很少使用。
第8章、用CSS制作實(shí)用的菜單
1、IE對(duì)list-style-type的很多屬性支持不是很理想
2、“display：block”語(yǔ)句可以將超鏈接設(shè)置成塊元素。
第9章、CSS濾鏡的應(yīng)用
CSS+DIV美化和布局篇
第10章、理解CSS定位與DIV布局
1、<div>標(biāo)記在HTML3.0時(shí)代就已出現(xiàn)，但并不常用，<span>標(biāo)記在HTML4.0時(shí)才被引進(jìn)。<div>和<span>的作用都是獨(dú)立出各個(gè)區(qū)塊。區(qū)別在于，<div>是一個(gè)塊級(jí)（block- level）元素，它包圍的元素會(huì)自動(dòng)換行。而<span>僅僅是一個(gè)行內(nèi)元素（inline elements），在它的前后不會(huì)換行。<span>沒(méi)有結(jié)構(gòu)上的意義，純粹是應(yīng)用樣式，當(dāng)其他行內(nèi)元素都不合適的時(shí)候，就可以使用<span>元素。此外，<span>可以包含在<div>標(biāo)記中，成為他的子元素，而翻過(guò)來(lái)則不行。
2、一個(gè)盒子模型由content（內(nèi)容）、border（邊框）、padding（間隙）和margin（間隔）4個(gè)部分組成。
3、在瀏覽器中，width和height的值都指的是width+padding或者h(yuǎn)eight+padding的值。
4、Border的groove、insert、outset和ridge這幾個(gè)值，IE都支持得不夠理想。IE不對(duì)border的背景上色，而 firefox的作用域?yàn)閏ontent+padding+border。
5、Padding用于控制content與border之間的距離。Margin指的是元素與元素之間的距離、塊與塊之間的距離。
6、在css中可以用過(guò)設(shè)置塊元素的clear屬性清除對(duì)float的影響。
第11章、CSS+div布局方法剖析
第12章、CSS+div美化與布局實(shí)戰(zhàn)
1、文檔類型聲明用來(lái)說(shuō)明文件使用的xHTML或者HTML是什么版本，分過(guò)渡型、嚴(yán)格型、框架型。這句代碼能夠使得IE瀏覽器能更加正確地解析 CSS語(yǔ)法。
2、 <script language=”javascript”>
var number = new Date().getSeconds() % 3 + 1; //隨機(jī)數(shù)，從1到3
//隨機(jī)選擇CSS外部文件
document.write(‘<link href=”0′ + number.toString() + ’/0′ + number.toString() + ’.css” rel=”stylesheet” type=”text/css”>’);
</script>
這段代碼產(chǎn)生隨機(jī)數(shù)，從而在刷新頁(yè)面的時(shí)候調(diào)用不同的外部樣式文件。
CSS混合應(yīng)用技術(shù)篇
第13章、CSS與JavaScript的綜合應(yīng)用
第14章、CSS與XML的綜合應(yīng)用
1、XML文件中的</br>標(biāo)記，在HTML中它表示換行，在XML中僅是一個(gè)空標(biāo)記，沒(méi)有任何意義。當(dāng)將它的display屬性設(shè)置為block塊時(shí)，則可以起到換行的效果。
2、XML的數(shù)據(jù)默認(rèn)都不是塊元素，而是行內(nèi)元素。所以在XML中有時(shí)需要將各個(gè)行都設(shè)置為塊，數(shù)據(jù)排列就會(huì)清晰很多。
3、Firefox等一些瀏覽器并不支持XML文件中行內(nèi)元素的width屬性，也不支持CSS常用的屬性覆蓋方法，因此顯示效果并不是很理想。
第15章、CSS與Ajax的綜合應(yīng)用
ajax不是單一的技術(shù)，而是4種技術(shù)的集合。Javascript、CSS、DOM、XMLHttpRequest對(duì)象。Javascript像膠水一樣將各個(gè)部分粘合在一起，定義應(yīng)用的工作流和業(yè)務(wù)邏輯。
通過(guò)使用Javascript操作DOM來(lái)改變和刷新用戶界面，不斷地重繪和重新組織顯示給用戶的數(shù)據(jù)，并且處理用戶基于鼠標(biāo)和鍵盤(pán)的交互。
CSS為應(yīng)用提供了統(tǒng)一的外觀，并且為以編程方式操作DOM提供了強(qiáng)大的途徑。在Ajax中，CSS仍然是不可缺少的美術(shù)大師。
XMLHttpRequest對(duì)象則用來(lái)與服務(wù)器進(jìn)行異步通信，在用戶工作時(shí)提交用戶的請(qǐng)求并獲取最新的數(shù)據(jù)。
Ajax的核心是Javascript對(duì)象XMLHttpRequest。
綜合案例篇
第16章、我的博客
第17章、小型工作室網(wǎng)站
第18章、企業(yè)網(wǎng)站
第19章、網(wǎng)上購(gòu)物網(wǎng)站
第20章、旅游網(wǎng)站
