建站知識(shí)

網(wǎng)站資訊動(dòng)態(tài),網(wǎng)站建設(shè)知識(shí),網(wǎng)站優(yōu)化SEO,營(yíng)銷型網(wǎng)站建設(shè),手機(jī)網(wǎng)站建設(shè),搜索引擎營(yíng)銷,常見問題解答,外貿(mào)網(wǎng)站建設(shè)等相關(guān)知識(shí)與動(dòng)態(tài)。

您當(dāng)前所在位置:首頁(yè) > 建站知識(shí) > 網(wǎng)站建設(shè)知識(shí) > 正文

網(wǎng)頁(yè)制作中一些容易被忽視的問題

2011-12-20

關(guān)于這篇文章其實(shí)早就想寫了,只是由于自己太懶才一直拖到現(xiàn)在。主要想談?wù)勗诰W(wǎng)頁(yè)制作中幾個(gè)比較容易被忽視的問題,算不上什么高深的教程,只是自己平時(shí)工作學(xué)習(xí)中所遇到的問題積累,寫下來一是可以給初學(xué)者提個(gè)醒,二來也是幫自己做個(gè)筆錄,畢竟年紀(jì)大了,記性不好了...


1、讓你想當(dāng)然,給你點(diǎn)顏色看看 這個(gè)問題其實(shí)被很多人忽略,小到個(gè)人站點(diǎn),大到門戶網(wǎng)站都有可能犯這個(gè)錯(cuò)誤。不信想想看,如果你所做的網(wǎng)站背景是白色的,那么你還會(huì)記得在 CSS 里寫下 Background-color:#ffffff 這句代碼嗎?我敢打賭,大部分人不會(huì)!并不是因?yàn)榇蠹彝祽?,而是這個(gè)舉手之勞被徹底忽略了,為什么?因?yàn)槲覀兯玫?Windows 操作系統(tǒng)在大多數(shù)的情況下,運(yùn)行在其上的各種軟件的默認(rèn)背景色是白色,這其中就包括 IE 瀏覽器,所以在網(wǎng)站背景是白色的條件下,許多的網(wǎng)頁(yè)制作者就想當(dāng)然的忽略了關(guān)于背景色的設(shè)置,反正大家都是白色,不設(shè)的話也看不出來。但是不要忘記了,Windows 從 XP 開始支持系統(tǒng)主題的更換,有很多第三方的主題會(huì)更改系統(tǒng)默認(rèn)的設(shè)置,其中就包括背景色的設(shè)置,如果沒有強(qiáng)制設(shè)定頁(yè)面中的背景色,那么頁(yè)面就會(huì)以當(dāng)前瀏覽器的背景色來顯示內(nèi)容,其結(jié)果就是網(wǎng)站美觀性被大大的降低,拿大家都熟悉的網(wǎng)易來舉例,下面的截圖是在我機(jī)子上瀏覽時(shí)的樣子,由于前不久換了一套 Vista 的主題風(fēng)格,所以瀏覽器的背景色變成了淺灰色。 仔細(xì)看看網(wǎng)易的 Logo ,看出來嗎?對(duì),那個(gè) Logo 的背景是白色的,但旁邊的背景色卻是灰色的,換句話說就是網(wǎng)易整個(gè)頁(yè)面的背景原定就是白色的,這在瀏覽器背景為白色的前提下是看不出什么來的,但是像現(xiàn)在這樣就“漏餡”了。不光是網(wǎng)易 ,許多的門戶站都是這樣,具體我就不去舉例了,可見關(guān)于 Background-color 設(shè)定的重要性。所以,不論你的網(wǎng)站是什么樣的背景色,請(qǐng)一點(diǎn)記住把它設(shè)定好,哪怕它是白色!

2、立正!向左~~~看齊 大家都知道 Table 的默認(rèn)水平對(duì)齊方式(align)為左對(duì)齊,設(shè) align="left" 和不設(shè)其效果是一樣的,于是很多人不去設(shè)置這個(gè)屬性,我以前也是如此。但是在某些特殊的情況下,IE 會(huì)把默認(rèn)的左對(duì)齊理解為居中對(duì)齊,從而導(dǎo)致頁(yè)面的排版出現(xiàn)問題,雖然說具體是什么情況下會(huì)出問題連我自己都說不清楚,但是這種情況絕對(duì)存在,所以大家在做頁(yè)面的時(shí)候一定要習(xí)慣性的設(shè)置表格的 align 屬性,不要偷懶跳過這步,對(duì)頁(yè)面的表現(xiàn)來說,這所謂的多此一舉絕對(duì)有益無(wú)害。

3、單元格寬度-隱形殺手 不知你有沒有遇見過這種情況,假設(shè)當(dāng)你給一個(gè)單元格的 align 設(shè)置了左對(duì)齊后,卻發(fā)現(xiàn)放在單元格中的文字并沒有應(yīng)用該屬性的效果,反而繼續(xù)是居中顯示,查看文字兩端也并沒有發(fā)現(xiàn)任何垃圾代碼包含其中,可是無(wú)論如何都改變不了文字的位置。郁悶嗎?反正當(dāng)時(shí)我是很郁悶,直到后來,我才發(fā)現(xiàn)原來是單元格的 Width 屬性在作怪,將其刪除或重新設(shè)置后問題得到解決,所以,當(dāng)你也遇到同樣的問題時(shí),不妨檢查一下出問題單元格的 Width 設(shè)置,相信你會(huì)找到解決的方法。

4、打死滾動(dòng)條都不消失 有時(shí)為了一些個(gè)性化的需要,有些人喜歡將瀏覽器的滾動(dòng)條隱藏掉,這個(gè)效果做起來很容易,但是有時(shí)會(huì)發(fā)現(xiàn)明明代碼一點(diǎn)問題沒有,而且查看用的瀏覽器也不是非 IE 內(nèi)核型的,但可惡的滾動(dòng)條就是不消失!而且這個(gè)問題很多都出現(xiàn)在用 DW 等可視化編輯軟件制作出的網(wǎng)頁(yè)上。那原因是什么呢?其實(shí)原因就在該頁(yè)面的頭部代碼里,查看該頁(yè)面的源代碼,你會(huì)發(fā)現(xiàn)在最上邊有類似這樣的兩句代碼: 這兩句代碼叫做 DOCTYPE 聲明,是 Document Type(文檔類型)的簡(jiǎn)寫,用來說明你用的 XHTML 或者 HTML 是什么版本。簡(jiǎn)單點(diǎn)說這兩句代碼是制作標(biāo)準(zhǔn)化頁(yè)面所必不可少的關(guān)鍵組成部分,瀏覽器就是根據(jù)你定義的文檔類型來解釋你頁(yè)面的標(biāo)識(shí),并展現(xiàn)出來的。換句話說,如果你定義了一個(gè)錯(cuò)誤的 DOCTYPE,那么你的標(biāo)識(shí)和 CSS 都不會(huì)生效。而定義滾動(dòng)條顯示與否的 overflow、overflow-x、overflow-y 這三個(gè)屬性恰恰沒有被網(wǎng)頁(yè)標(biāo)準(zhǔn)所采納,所以如果你的頁(yè)面上方定義過 DOCTYPE ,那么這三個(gè)屬性便是無(wú)效代碼了,解決方法就是刪除頭部的 DOCTYPE 聲明,雖然在標(biāo)準(zhǔn)日益普及的今天不推薦這么做。

5、都是注釋惹的禍 為代碼寫注釋是個(gè)好習(xí)慣,但是有時(shí)也會(huì)出現(xiàn)一些問題,例如為 CSS 寫中文注釋。如果你為自己定義的 CSS 寫了中文注釋,那么在一些特殊情況下(例如服務(wù)器端的支持,頁(yè)面所用的程序類型等)會(huì)導(dǎo)致部分代碼無(wú)故失效,這種情況我遇見好幾回了,所以在技術(shù)上沒解決這個(gè)問題之前,還是不要為 CSS 寫注釋的好,養(yǎng)成良好的命名習(xí)慣足以讓其它人看懂自己代碼的意義,即使一定要寫,也請(qǐng)用英文寫吧...什么?拼音?。。“萃?,你用拼音試試看,保證一個(gè)星期后連你自己都不明白那寫的是什么。

6、神啊,發(fā)光吧~~~這個(gè)問題有些濫竽充數(shù)的嫌疑,只是有很多人問起過,所以也一并放上來。是關(guān)于 CSS 的 Glow Filters ,這個(gè)濾鏡的效果是對(duì)環(huán)繞對(duì)象內(nèi)容邊緣制作發(fā)光效果,也有人稱描邊效果,多被用在文字的表現(xiàn)上,但是許多人在運(yùn)用了該濾鏡后發(fā)現(xiàn)并沒有出現(xiàn)想要的效果,究其原因多半是由于把這個(gè)濾鏡直接運(yùn)用到了文字上,要知道該濾鏡對(duì)文字是沒有效果的,那為什么還能制作出發(fā)光文字呢?那是因?yàn)橐欢ㄒ阉\(yùn)用在放置文字的容器上,例如 Table 。所以,如果沒有效果的話,就檢查一下是不是用錯(cuò)地方了。 該濾鏡的另外一個(gè)問題是,雖然發(fā)光效果是有了,但是感覺文字上的那圈光暈好像是被裁了一樣,少了一塊似的。這是由于所放置文字的容器高度低于該濾鏡的發(fā)光范圍所至,解決方法有三種: 1、縮小 Font-Size 2、增加 Height 值高度 3、降低 Strength 值的大小

7、思考中... 其實(shí)這些問題都不是什么了不起的大問題,但往往越是小問題才越容易被人忽略,希望上面這些經(jīng)驗(yàn)教訓(xùn)對(duì)你能有所幫助,哪怕有一個(gè)人從中收益就不枉我羅哩羅嗦這么半天了。

以上部分內(nèi)容(文字、圖片)收集于互聯(lián)網(wǎng),版權(quán)歸原作者所有。感謝每一位辛勤著寫的作者,感謝每一位的分享。免責(zé)聲明:如有侵犯您的原創(chuàng)版權(quán)請(qǐng)告知,我們將盡快刪除相關(guān)內(nèi)容,感謝您的理解與支持。
上一篇:重慶企業(yè)網(wǎng)站建設(shè) 如何選擇空間最合適? 下一篇:創(chuàng)建Google關(guān)鍵詞廣告的12高招

服務(wù)項(xiàng)目查看更多

免責(zé)聲明

非常感謝您訪問我們的網(wǎng)站,并請(qǐng)您仔細(xì)閱讀本聲明的所有條款:

1、本站部分內(nèi)容來源自網(wǎng)絡(luò),涉及到的部分文章和圖片版權(quán)屬于原作者,本站轉(zhuǎn)載僅供大家學(xué)習(xí)和交流,切勿用于任何商業(yè)活動(dòng)。

2、本站不承擔(dān)用戶因使用這些資源對(duì)自己和他人造成任何形式的損失或傷害。

3、本聲明未涉及的問題參見國(guó)家有關(guān)法律法規(guī),當(dāng)本聲明與國(guó)家法律法規(guī)沖突時(shí),以國(guó)家法律法規(guī)為準(zhǔn)。

4、如果侵害了您的合法權(quán)益,請(qǐng)您及時(shí)與我們聯(lián)系,我們會(huì)在第一時(shí)間刪除相關(guān)內(nèi)容!

聯(lián)系方式:023-65309616
電子郵件:543874515@qq.com

ENABLE YOUR BRAND
TO BURST INTO EXCELLENCE
中高端定制開發(fā)服務(wù)商
掃一掃,微信咨詢
130-7236-3699 543874515