精彩、漂亮是每一個(gè)設(shè)計(jì)者在制作網(wǎng)頁(yè)時(shí)的不懈追求，而網(wǎng)頁(yè)的精彩幾乎都離不開(kāi)CSS的強(qiáng)力“支撐”；CSS是一種為超文本標(biāo)簽語(yǔ)言提供增強(qiáng)補(bǔ)充服務(wù)的技 術(shù)，可對(duì)每一個(gè)html的標(biāo)簽做精雕細(xì)刻的修飾。活用CSS，將會(huì)使網(wǎng)頁(yè)更加生動(dòng)活潑。不過(guò)，普通的網(wǎng)頁(yè)編輯工具在CSS方面，表現(xiàn)難能讓人滿(mǎn)意；為了充 分發(fā)揮CSS潛能，設(shè)計(jì)出更加美麗的網(wǎng)頁(yè).

　　最新版本：3.11
　　文件大小：3836KB
　　 軟件性質(zhì)：共享
　　 使用平臺(tái)：Win9x/Me/NT/2000/XP

　　軟件功能

　 　該程序是一款功能強(qiáng)大的CSS編輯設(shè)計(jì)工具，功能相當(dāng)多，不但你可以輕松創(chuàng)建各種樣式的文件，而且方便對(duì)已有的樣式進(jìn)行編輯，其內(nèi)置的CSS碼檢查功 能，可以讓你減少寫(xiě)錯(cuò)的機(jī)會(huì)。特別是它的HELP文件中詳細(xì)的各種CSS指令介紹，很適合用作參考文件和初次接觸CSS的用戶(hù)學(xué)習(xí)使用。

　　下載安裝

　 　Topstyle是一款專(zhuān)門(mén)用來(lái)讓設(shè)計(jì)和編輯樣式的工具，它的大小已經(jīng)達(dá)到4M左右，可以說(shuō)該軟件是那種“強(qiáng)壯剽悍”型的，不過(guò)身材龐大也意味著該軟件 實(shí)現(xiàn)的功能是比較新穎、實(shí)用和強(qiáng)大的。利用該軟件，我們可以隨心所欲地創(chuàng)建各種樣式表文件，并且能為網(wǎng)頁(yè)輕松設(shè)計(jì)出各種令你感到非常滿(mǎn)意的視覺(jué)效果。從網(wǎng) 上下載下來(lái)的Topstyle是一個(gè)擴(kuò)展名為exe的可執(zhí)行文件，大家在進(jìn)行安裝之前，可以直接用鼠標(biāo)雙擊它，這樣系統(tǒng)就能自動(dòng)打開(kāi)一個(gè)標(biāo)準(zhǔn)的 windows程序安裝界面，我們只要按照界面的提示，一路單擊next按鈕就能順利完成安裝了。該程序在沒(méi)有注冊(cè)的情況下，可以在同一臺(tái)計(jì)算機(jī)中使用 20次；隨Topstyle一起安裝到系統(tǒng)中的還有一個(gè)名為T(mén)opstyle lite的程序，該程序在使用次數(shù)上沒(méi)有什么限制，不過(guò)在功能方面肯定會(huì)有所限制，但對(duì)于普通個(gè)人用戶(hù)來(lái)說(shuō)，它提供的功能已經(jīng)足夠了！

圖1

　 　安裝完成后，程序在默認(rèn)狀態(tài)下會(huì)自動(dòng)在系統(tǒng)的開(kāi)始菜單中添加一個(gè)Topstyle程序運(yùn)行菜單項(xiàng)。此時(shí)，我們要是想運(yùn)行Topstyle程序的話(huà)，可以 用鼠標(biāo)依次單擊“開(kāi)始”/“程序”/“Topstyle 3”，屏幕上首先會(huì)出現(xiàn)一個(gè)樣式定義向?qū)Т翱冢诔醮问褂迷摮绦驎r(shí)，可以先一路單擊“next”按鈕，這樣就能打開(kāi)一個(gè)如圖1所示的程序主操作界面了。為 防止日后用戶(hù)暫時(shí)不需要該軟件時(shí)，該程序會(huì)占用的系統(tǒng)資源可能較多，我們可以在控制面板窗口中，利用添加刪除程序來(lái)將Topstyle程序的所有組件徹底 從系統(tǒng)中清除，因此從這個(gè)意義上來(lái)說(shuō)，該軟件還可以稱(chēng)得上是一款綠色軟件。一旦運(yùn)行該程序后，該界面就是一種完全的XP風(fēng)格，讓人感到親切、柔和！

　　創(chuàng)建新的樣式

　 　Topstyle程序?yàn)槲覀兲峁┝藥追N創(chuàng)建新樣式文件的方法，其中比較簡(jiǎn)單的一種就是使用向?qū)Чδ軄?lái)創(chuàng)建樣式文件；在使用這種方法時(shí)，可以先用鼠標(biāo)單擊 主界面中的“file”菜單項(xiàng)，從打開(kāi)的下拉菜單中執(zhí)行“New style sheet wizard”命令，這樣就能打開(kāi)一個(gè)如圖2所示的向?qū)гO(shè)置界面；用鼠標(biāo)單擊“next”按鈕，在接下來(lái)出現(xiàn)的界面中，你就能對(duì)網(wǎng)頁(yè)中的文字顏色以及背景 顏色進(jìn)行合適的設(shè)置；設(shè)置完成后，繼續(xù)單擊“next”，接著為網(wǎng)頁(yè)中文字選擇一種合適的字體，需要哪種字體時(shí)，可以在對(duì)應(yīng)字體前面的方框中打上勾號(hào)；完 成了這步設(shè)置后，下面你還可以設(shè)置網(wǎng)頁(yè)中文字的大小，文字的加粗屬性，網(wǎng)頁(yè)中超級(jí)鏈接的正常顯示顏色以及單擊后的顏色變化，完成所有相關(guān)參數(shù)的設(shè)置后，向 導(dǎo)設(shè)置框還會(huì)打開(kāi)一個(gè)如圖3所示的預(yù)覽界面；要是對(duì)設(shè)置的效果感到滿(mǎn)意的話(huà)，可以繼續(xù)用鼠標(biāo)單擊“next”來(lái)完成最后的樣式創(chuàng)建任務(wù)。倘若對(duì)設(shè)置的效果 不滿(mǎn)意的話(huà)，還能在這里單擊“previous”按鈕，來(lái)返回到前面的設(shè)置頁(yè)面中，重新調(diào)整網(wǎng)頁(yè)的樣式屬性，直到自己滿(mǎn)意為止。最后，我們可以為上面創(chuàng)建 的樣式文件起一個(gè)名稱(chēng)，同時(shí)選擇好文件保存的位置，并單擊向?qū)Ы缑嬷械摹癴inish”按鈕結(jié)束樣式文件的創(chuàng)建工作。

圖2

圖3

　　 編輯已有樣式

　 　除了創(chuàng)建新的樣式外，我們還能對(duì)目前已經(jīng)存在的樣式文件進(jìn)行編輯和調(diào)整。編輯調(diào)整時(shí)，可以在主界面中依次執(zhí)行“file”/“open”命令，來(lái)將已有 的樣式文件打開(kāi)，任何在Topstyle程序界面中，利用工具欄中的各種工具按鈕，來(lái)對(duì)樣式文件進(jìn)行任意修改；要是自己非常熟悉網(wǎng)頁(yè)源代碼的話(huà)，可以選擇 在源代碼窗口中來(lái)進(jìn)行修改（如圖4所示），倘若對(duì)源代碼比較“感冒”的話(huà)，我們還能在Topstyle程序界面右上角的“Style Inspector”子窗口中來(lái)修改，這樣可以更直接一點(diǎn)，而且在這里我們幾乎也能修改樣式中的任意參數(shù)，比方說(shuō)網(wǎng)頁(yè)文字的大小、字體、顏色，網(wǎng)頁(yè)的背景 顏色、超級(jí)鏈接的顏色等。此外，執(zhí)行菜單欄中的“file”/“open from web”命令，在隨后打開(kāi)的窗口中直接輸入某網(wǎng)站的網(wǎng)址，我們就能對(duì)指定網(wǎng)站上的網(wǎng)頁(yè)樣式進(jìn)行修改和編輯了。

圖4

　　檢查樣式錯(cuò)誤

　 　在編輯修改樣式的過(guò)程中，可能會(huì)因操作不慎，出現(xiàn)這樣或者那樣的錯(cuò)誤，此時(shí)你大可不必?fù)?dān)心，因?yàn)門(mén)opstyle程序?yàn)槲覀兲峁┝薈SS碼的錯(cuò)誤檢查功 能，這樣我們?cè)谛薷倪^(guò)程中，產(chǎn)生的任何錯(cuò)誤Topstyle程序都不會(huì)忽略。我們對(duì)樣式的任何一步修改和創(chuàng)建工作，都在Topstyle程序的“監(jiān)控”之 下，一旦修改出錯(cuò)的話(huà)，程序會(huì)馬上彈出一個(gè)對(duì)話(huà)框，如圖5所示，來(lái)提醒我們當(dāng)前樣式中出現(xiàn)了錯(cuò)誤；同時(shí)在主界面的源代碼編輯子窗口中，我們會(huì)發(fā)現(xiàn)程序在出 錯(cuò)的地方以紅顏色來(lái)突出顯示；而在“Style Inspector”子窗口中，程序會(huì)以藍(lán)顏色將出錯(cuò)的地方突出顯示出來(lái)；一旦我們將錯(cuò)誤調(diào)整過(guò)來(lái)后，對(duì)應(yīng)位置處的突出顯示顏色也會(huì)自動(dòng)消失。

圖5

　　預(yù)覽樣式效果

　 　Topstyle程序還為我們提供了即時(shí)預(yù)覽功能，利用該功能，我們對(duì)樣式參數(shù)每一步的修改效果都能被即時(shí)顯示出來(lái)。主界面中的“Output”子窗口 就是用來(lái)即時(shí)預(yù)覽樣式效果的，在該子窗口中，我們發(fā)現(xiàn)它包含了五個(gè)標(biāo)簽頁(yè)面，用鼠標(biāo)單擊“preview”標(biāo)簽，就會(huì)看到具體的樣式預(yù)覽效果了；由于 Topstyle程序支持各個(gè)版本的IE瀏覽器、Netscape瀏覽器以及Opera瀏覽器，因此我們可以對(duì)各種樣式進(jìn)行邊修改邊預(yù)覽，從而保證了樣式 編輯的效率。此外，在“Style checker”標(biāo)簽頁(yè)面中，我們能很清楚地看到當(dāng)前樣式文件中，有哪些語(yǔ)法上的錯(cuò)誤，用鼠標(biāo)單擊其中的某一錯(cuò)誤內(nèi)容后，Topstyle程序還能彈出一 個(gè)信息提示，來(lái)知道我們?cè)撊绾握_改正語(yǔ)法錯(cuò)誤。在其他的標(biāo)簽頁(yè)面中，我們還可以了解到當(dāng)前樣式表的一些注釋和統(tǒng)計(jì)信息，例如樣式文件中包含了多少行內(nèi)容 等。

　　輔助學(xué)習(xí)功能

　　 Topstyle程序特別為那些剛剛接觸CSS的菜鳥(niǎo)用戶(hù) 們，提供詳細(xì)的幫助功能。利用該功能，用戶(hù)可以從該程序內(nèi)置的help文件中，查詢(xún)到與CSS相關(guān)的各種指令的詳細(xì)用法介紹，以及編寫(xiě)CSS原代碼的一些 小技巧，菜鳥(niǎo)完全可以將它作為一個(gè)很好的CSS資料來(lái)學(xué)習(xí)使用。

　　 此外，與Topstyle程序一起安裝的Topstyle Lite版本，相對(duì)來(lái)說(shuō)，功能更簡(jiǎn)潔明了，我們可以在Topstyle程序的安裝目錄中運(yùn)行這個(gè)簡(jiǎn)裝版程序；該程序只為我們提供了簡(jiǎn)單的樣式文件的編輯、 創(chuàng)建以及預(yù)覽功能，而沒(méi)有向?qū)?chuàng)建功能、CSS碼檢查錯(cuò)誤功能等，不過(guò)這些功能對(duì)菜鳥(niǎo)用戶(hù)來(lái)說(shuō)，已經(jīng)是綽綽有余了！

　　 總之，Topstyle程序的整體性能很不錯(cuò)，是一款不可多得、不可不用的樣式表編輯工具。有了Topstyle程序的幫助，相信你一定會(huì)成為一位出色的CSS編輯和設(shè)計(jì)專(zhuān)家。