|
我想把本篇作為css基礎(chǔ)教程的序曲,從今天開始翻譯和整理我從設(shè)計(jì)網(wǎng)頁(yè)以來(lái)所學(xué)到的css基礎(chǔ)知識(shí)。本教程會(huì)分成N個(gè)部分,單獨(dú)發(fā)表,其間可能會(huì)插入幾篇與教程無(wú)關(guān)的文章。沒有具體的教程發(fā)表進(jìn)度,推薦關(guān)注本教程的朋友訂閱本站Feed。教程內(nèi)容的30%-50%為Jorux原創(chuàng),其余翻譯部分均為意譯,可能來(lái)源于多個(gè)國(guó)外站點(diǎn),并在教程結(jié)束時(shí)公布參考原文地址。
原文:http://jorux.com/archives/if-you-love-css/
需要什么軟件學(xué)習(xí)css?
一個(gè)文本編輯器和Firefox
1.文本編輯器:這里所指的是諸如windows自帶的記事本以及Editplus等改進(jìn)版記事本軟件。不推薦Dreamweaver, Frontpage等具有圖形化可視操作,不直接編輯css源代碼的軟件。這類軟件確實(shí)能在學(xué)習(xí)css的初期幫助你迅速達(dá)成你的愿望,但是不久你就會(huì)發(fā)現(xiàn)這些被Dreamweaver所自動(dòng)生成的css代碼冗長(zhǎng)繁瑣,css文件體積增大。一旦離開這些軟件你的頭腦就會(huì)像一張白紙,基本的css語(yǔ)法都想不起來(lái)。本人曾走過彎路,望初學(xué)css的朋友借鑒。
本人使用Editplus編寫網(wǎng)頁(yè)代碼,其屬于加強(qiáng)版的記事本,具有多步撤銷,語(yǔ)法加亮,全部替換等功能,安裝后無(wú)需設(shè)置,推薦把屏幕字體改為14號(hào)Verdana,方便閱讀編寫。
2.Firefox:本人絕非 Firefox 的Fan,它也不是盞省油的燈(占用內(nèi)存多)。但作為一個(gè)免費(fèi)軟件,再配上適當(dāng)?shù)牟寮,是網(wǎng)頁(yè)設(shè)計(jì)者的必備工具,如何使用和選擇插件體現(xiàn)設(shè)計(jì)者專業(yè)素質(zhì)的水平。推薦安裝以下插件:
必裝插件:
IE Tab :調(diào)試網(wǎng)頁(yè)在IE內(nèi)核瀏覽器表現(xiàn)的優(yōu)秀插件,不管你喜不喜歡,請(qǐng)安裝!
強(qiáng)烈推薦安裝的插件:
Web Developer:其功能之強(qiáng)大,以至于我還沒用全它的功能,但是其直接查看網(wǎng)頁(yè)css代碼功能,頁(yè)面信息的顯示,以及驗(yàn)證css和Html的功能非常實(shí)用。
ColorZilla:方便提取網(wǎng)頁(yè)中任何元素的顏色。
Html Validator:安裝這個(gè)插件后會(huì)在瀏覽器右下角生成一個(gè)圖標(biāo),綠色對(duì)號(hào)表示當(dāng)前網(wǎng)頁(yè)的Html通過驗(yàn)證,紅色叉號(hào)表示Html有錯(cuò)誤,黃色嘆號(hào)表示Html存在無(wú)法通過驗(yàn)證的警告語(yǔ)句。雙擊圖標(biāo)就會(huì)高亮顯示該網(wǎng)頁(yè)存在的不能通過驗(yàn)證的語(yǔ)句數(shù)目、位置以及修改建議。作為設(shè)計(jì)者,最好養(yǎng)成隨時(shí)觀察這個(gè)圖標(biāo)的習(xí)慣,你就會(huì)發(fā)現(xiàn)網(wǎng)上聲稱能通過驗(yàn)證的網(wǎng)頁(yè),幾乎都是錯(cuò)誤或是警告。本網(wǎng)站除極個(gè)別網(wǎng)頁(yè)外均通過驗(yàn)證。
FireBug:安裝這個(gè)插件后也會(huì)在瀏覽器右下角生成一個(gè)圖標(biāo),綠色對(duì)號(hào)表示當(dāng)前網(wǎng)頁(yè)的Javascript通過驗(yàn)證,并能對(duì)錯(cuò)誤的Javascript代碼debug。我們暫時(shí)并不需要這個(gè)功能。需要用到的功能是其Inspector,你需要通過定制工具欄,把Inspector的"眼鏡"圖標(biāo)拖入工具欄。點(diǎn)擊Inspector圖標(biāo)后,將鼠標(biāo)移到網(wǎng)頁(yè)任意位置,你就能在靠下的窗口看到網(wǎng)頁(yè)Html文件的相應(yīng)源代碼,在網(wǎng)頁(yè)調(diào)試時(shí)非常有用。
裝這么多插件是不是有點(diǎn)累,我光寫都有點(diǎn)吃不消,所以休息一下,在下一篇文章進(jìn)入css教程的正文部分。
|
|
【收藏】【打印】【進(jìn)入論壇】 |
|
|
|
|
|
|
|