Div+CSS網(wǎng)頁(yè)布局實(shí)現(xiàn)Web標(biāo)準(zhǔn)時(shí)會(huì)出現(xiàn)哪些問(wèn)題

本篇內(nèi)容主要講解“Div+CSS網(wǎng)頁(yè)布局實(shí)現(xiàn)Web標(biāo)準(zhǔn)時(shí)會(huì)出現(xiàn)哪些問(wèn)題”,感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷,實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“Div+CSS網(wǎng)頁(yè)布局實(shí)現(xiàn)Web標(biāo)準(zhǔn)時(shí)會(huì)出現(xiàn)哪些問(wèn)題”吧!

成都創(chuàng)新互聯(lián)公司網(wǎng)站設(shè)計(jì),為客戶(hù)量身定制各類(lèi)網(wǎng)站建設(shè)業(yè)務(wù),包括企業(yè)型、電子商務(wù)型、響應(yīng)式網(wǎng)站開(kāi)發(fā)、行業(yè)門(mén)戶(hù)型等各類(lèi)網(wǎng)站,實(shí)戰(zhàn)經(jīng)驗(yàn)豐富,成功案例眾多。以客戶(hù)利益為出發(fā)點(diǎn),成都創(chuàng)新互聯(lián)公司網(wǎng)站制作為客戶(hù)規(guī)劃、按需制作網(wǎng)站符合企業(yè)需求、帶有營(yíng)銷(xiāo)價(jià)值的網(wǎng)絡(luò)建站方案認(rèn)真對(duì)待每一個(gè)客戶(hù),我們不用口頭的語(yǔ)言來(lái)吹擂我們的優(yōu)秀,數(shù)千家的成功案例見(jiàn)證著我們的成長(zhǎng)。

Div+CSS網(wǎng)頁(yè)布局、web標(biāo)準(zhǔn)應(yīng)用容易出現(xiàn)的問(wèn)題匯總

應(yīng)用Div+CSS網(wǎng)頁(yè)布局,制作符合web標(biāo)準(zhǔn)的網(wǎng)站時(shí),容易出現(xiàn)的一些問(wèn)題?,F(xiàn)在總結(jié)一下,以便大家能夠看到明白問(wèn)題出在那里。

一.CSS校驗(yàn)的問(wèn)題

我們?cè)O(shè)計(jì)的網(wǎng)頁(yè),都希望符合XHTML標(biāo)準(zhǔn),CSS通過(guò)W3C的校驗(yàn)。有些未通過(guò)CSS2.0校驗(yàn),主要校驗(yàn)錯(cuò)誤都是:“Line:0font-family:建議你指定一個(gè)種類(lèi)族科作為***的選擇”
W3C建議字體定義的時(shí)候,***以一個(gè)類(lèi)別的字體結(jié)束,而不要以單獨(dú)某個(gè)字體結(jié)束。例如"sans-serif"就可以保證在不同操作系統(tǒng)下,網(wǎng)頁(yè)字體都能被顯示。

雖然多數(shù)人都在body標(biāo)簽上定義了"sans-serif",但在其它的id或class中再次定義字體時(shí)漏了sans-serif,被認(rèn)為校驗(yàn)不通過(guò)。這個(gè)錯(cuò)誤不是很?chē)?yán)重,只要稍加注意就可以避免。

二.CSS的書(shū)寫(xiě)建議

給CSS文件加注釋。注釋會(huì)為你今后的維護(hù)帶來(lái)方便,建議盡可能給CSS文件加注釋?zhuān)灰獡?dān)心增加少量的字節(jié)。盡量簡(jiǎn)寫(xiě)CSS語(yǔ)法。比如顏色值"#FFFFFF"可以簡(jiǎn)寫(xiě)成"#FFF";"padding-top:30px;Padding-right:0;padding-bottom:10px;padding-left:20px"可以簡(jiǎn)寫(xiě)為"padding:30px010px20px;"。在定義技巧上有更多的節(jié)省技巧,隨著對(duì)CSS應(yīng)用的熟練,你會(huì)不斷發(fā)現(xiàn)更好的辦法。

三.XHTML校驗(yàn)的問(wèn)題

往往大家對(duì)CSS的校驗(yàn)比較注意,但在XHTML符合標(biāo)準(zhǔn)方面有點(diǎn)忽視,出現(xiàn)很多低級(jí)錯(cuò)誤。主要問(wèn)題羅列如下:

◆target="_blank",這個(gè)語(yǔ)法在HTML4.0里是正確的,在XHTML1.0里是不允許使用的。解決的辦法之一是寫(xiě)成target="new",另外一個(gè)辦法是用js處理所有的target;

◆樣式表***不要內(nèi)嵌,將樣式表文件獨(dú)立出來(lái)易于維護(hù)。如果內(nèi)嵌<style>一定要寫(xiě)成<styletype="text/css">,其中的type不能忽略,否則XHTML無(wú)法判斷你的style作用在什么方面。

◆<br>必須寫(xiě)成<br/>,XHTML要求所有的標(biāo)簽必須關(guān)閉,不成對(duì)的標(biāo)簽直接在后面加"/"。

◆重復(fù)使用同一ID。一個(gè)ID在XHTML中只能使用1次,如果需要多次引用樣式,應(yīng)該使用class。

◆Flash的嵌入方法錯(cuò)誤。<embed>最早是Netscape的私有標(biāo)簽,即使后來(lái)為IE所支持,但始終沒(méi)有被W3C承認(rèn),在HTML4.0沒(méi)有<embed>這個(gè)標(biāo)簽。W3C主張的是采用<object>標(biāo)簽。為了解決不同瀏覽器的兼容,有一個(gè)變通的解決方法是2個(gè)標(biāo)簽都采用。
完整的示例代碼如下(flash背景為透明):

ExampleSourceCode

<object classid="clsid:27CDB6E-AE6D-11cf-96B8-444553540000"codebase=  "http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"  width="300"height="100"> <paramnameparamname="quality"value="high"> <paramnameparamname="wmode"value="transparent"> <paramnameparamname="SRC"value="test.swf"> <embedsrcembedsrc="test.swf"wmode="transparent"quality="high" pluginspage="  http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"  type="application/x-shockwave-flash"width="300"height="100"> </embed> </object>

但直接寫(xiě)在XHTML中依然不可以,我們現(xiàn)在只能通過(guò)把上面代碼寫(xiě)在flash.js文件里,然后再調(diào)用來(lái)騙過(guò)校驗(yàn)。
<scripttype="text/javascript"src="flash.js"></script>
關(guān)于flash是否符合標(biāo)準(zhǔn),是一個(gè)存在爭(zhēng)議的問(wèn)題。

◆類(lèi)似id=headerclass=title代碼都應(yīng)該寫(xiě)成id="header"class="title"。給屬性值加引號(hào)是最XHTML基本的語(yǔ)法規(guī)則。

四.兼容的問(wèn)題

有些網(wǎng)站在IE6.0、MozillaFirefox1.0、Opera7.12中瀏覽發(fā)生變形和錯(cuò)位。
在IE里居中,但Mozilla里沒(méi)有。在IE中設(shè)置body{TEXT-ALIGN:center;}就已經(jīng)可以居中了,但在Mozilla中必須對(duì)需要居中的層再加入以下樣式設(shè)置:MARGIN-RIGHT:auto;MARGIN-LEFT:auto;

超出寬度。在Mozilla里看正常的頁(yè)面,在IE里因?yàn)槌鰧挾榷冃?,并排的層移到下面去了。這個(gè)情況是因?yàn)镮E和Mozilla對(duì)盒模型解釋不同造成的,有很多解決辦法,比如"!important"方法。

web標(biāo)準(zhǔn)和CSS布局已經(jīng)被越來(lái)越多的設(shè)計(jì)師了解和掌握。CSS布局經(jīng)過(guò)一段時(shí)間的消化理解和應(yīng)用,會(huì)有更多技術(shù)美觀兼顧的網(wǎng)頁(yè)涌現(xiàn)。

到此,相信大家對(duì)“Div+CSS網(wǎng)頁(yè)布局實(shí)現(xiàn)Web標(biāo)準(zhǔn)時(shí)會(huì)出現(xiàn)哪些問(wèn)題”有了更深的了解,不妨來(lái)實(shí)際操作一番吧!這里是創(chuàng)新互聯(lián)網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢(xún),關(guān)注我們,繼續(xù)學(xué)習(xí)!

網(wǎng)站題目:Div+CSS網(wǎng)頁(yè)布局實(shí)現(xiàn)Web標(biāo)準(zhǔn)時(shí)會(huì)出現(xiàn)哪些問(wèn)題
網(wǎng)頁(yè)地址:http://muchs.cn/article40/jpdsho.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供響應(yīng)式網(wǎng)站、微信公眾號(hào)網(wǎng)站維護(hù)、品牌網(wǎng)站建設(shè)外貿(mào)網(wǎng)站建設(shè)、全網(wǎng)營(yíng)銷(xiāo)推廣

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話(huà):028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

成都定制網(wǎng)站建設(shè)