網(wǎng)頁源代碼想看就看

對(duì)于網(wǎng)頁制作者來說，看到一些設(shè)計(jì)得較有特色的網(wǎng)頁，通過查看源代碼能幫助用戶更好地制作網(wǎng)頁。但是IE提供的查看源文件功能很有限，許多功能都不能實(shí)現(xiàn)，如想查看網(wǎng)頁的外部樣式表及Java腳本代碼、保存各類網(wǎng)頁文件等，都無法實(shí)現(xiàn)。

其實(shí)可以使用“Instant Source'’這個(gè)工具來輕松查看和保存網(wǎng)頁的源代碼及網(wǎng)頁文件，它是一個(gè)非常實(shí)用的IE插件。“Instant Source”安裝后自動(dòng)整合到IE瀏覽器中，需要使用時(shí)，只要點(diǎn)擊IE工具欄上的“InstantSource”圖標(biāo)，在瀏覽器下方便出現(xiàn)一個(gè)代碼顯示窗口及它的功能按鈕了。

輕輕一點(diǎn)網(wǎng)頁源代碼全顯

打開需要查看源代碼的網(wǎng)頁，在“Instant Source”的功能按鈕區(qū)單擊“顯示”圖標(biāo)，這時(shí)會(huì)出現(xiàn)一個(gè)下拉菜單，其中有“鼠標(biāo)所指元素”、“選定文本”、“整個(gè)網(wǎng)頁”、“鼠標(biāo)所指的顏色”等菜單項(xiàng)，如從中選擇“鼠標(biāo)所指元素”這種顯示模式，之后只要用鼠標(biāo)指向網(wǎng)頁上的某一元素，它的網(wǎng)頁代碼便會(huì)即時(shí)顯示在下面的代碼區(qū)域(如圖1)。對(duì)于加入網(wǎng)頁中的樣式表CSS、Java腳本等外部對(duì)象的代碼，也可以點(diǎn)擊代碼窗口下方相應(yīng)按鈕來查看。若要查看網(wǎng)頁中某處的顏色，就選擇“鼠標(biāo)所指的顏色”菜單項(xiàng)，這時(shí)鼠標(biāo)在網(wǎng)頁中移動(dòng)就能直接獲取網(wǎng)頁上各種顏色的R、G、B值及HEX代碼。

另外，在查看代碼時(shí)可使用“復(fù)制”、“查找”等按鈕，方便實(shí)現(xiàn)選定代碼的提取，還能從眾多代碼中快速定位到自己需要的代碼位置。

巧妙設(shè)置查看更快捷

工具的許多強(qiáng)大的功能通過設(shè)置才能發(fā)揮出來。單擊功能按鈕區(qū)中的“選項(xiàng)”，就會(huì)彈出一個(gè)“In st antsource選項(xiàng)”對(duì)話框(如圖2)，在‘常規(guī)設(shè)置“標(biāo)簽下，可以設(shè)置更為詳細(xì)的顯示模式。在這兒選擇“鼠標(biāo)所指的HTML元素”這個(gè)單選項(xiàng)后，再選擇“自由模式”或“僅在按壓Ctrl鍵時(shí)顯示源代碼”等選項(xiàng)，就可以配合Shift、Ctrl鍵的操作來顯示更多有價(jià)值的內(nèi)容，還可以鎖定顯示的源代碼和顯示HTML代碼的上級(jí)元素。

如果“Instant Source'’默認(rèn)的代碼顯示字體和顏色不符合自己的習(xí)慣，就可切換到“字體和顏色”標(biāo)簽中進(jìn)行設(shè)置，在這兒可以設(shè)置字體大小、顯示代碼的背景色和代碼文本顏色等，以符合自己的閱讀習(xí)慣。代碼顯示默認(rèn)是來顯示行號(hào)的，這在閱讀眾多代碼時(shí)很不方便，切換到“頁邊空白”標(biāo)簽中，在其中勾選“顯示行號(hào)”項(xiàng)，顯示代碼時(shí)就會(huì)顯示代碼的行號(hào)，方便閱讀。

現(xiàn)在的網(wǎng)頁都會(huì)與其它網(wǎng)頁鏈接，也會(huì)引入外部對(duì)象，如樣式表c ss、J av a腳本、圖片、Flash動(dòng)畫等，要保存這些引入網(wǎng)頁的外部對(duì)象，只需單擊“對(duì)象”圖標(biāo)，打開一個(gè)“頁面對(duì)象”窗口(如圖3)，在這里選擇需要的東西，再單擊“保存”按鈕就可以了，更好的是在這兒可以選擇“鏈接”下的網(wǎng)頁地址來保存各類網(wǎng)頁文件，如asp、aspx、php等網(wǎng)頁文件。還可以單擊“全部保存”選項(xiàng)，全部保存到自己的硬盤中。

利用IE編輯修改網(wǎng)頁真直觀

對(duì)于保存在本地硬盤中的網(wǎng)頁文件，通常是使用網(wǎng)頁編輯軟件編輯后，再調(diào)用瀏覽器查看效果，其實(shí)安裝了“Instant Source”這個(gè)工具后，就可以在IE中瀏覽的同時(shí)直接對(duì)網(wǎng)頁進(jìn)行編輯修改了，只需選擇“顯示”按鈕下的“整個(gè)頁面(原始)”模式，就可以直接對(duì)源代碼進(jìn)行編輯，然后單擊“應(yīng)用”按鈕，就能馬上在瀏覽器窗口中看到編輯后的效果，并保存該網(wǎng)頁。

通過這個(gè)功能強(qiáng)大的網(wǎng)頁源代碼查看工具，就能讓制作網(wǎng)頁工作事半功倍，提高效率，能吸取優(yōu)秀網(wǎng)頁的長處，方便地使用到我們的網(wǎng)頁當(dāng)中來。