10.30日(rì)音(yīn)訊，淺談自(zì&π)适應網頁設計(jì)的(de)講究方式，在HTML頭部增加∏☆viewport标簽。在網站(zhàn)HTML文(wén)件(ji¶λàn)的(de)開(kāi)頭，增加viewportm¥δ•eta标簽告訴浏覽器(qì)視(shì)口寬度等于設備屏幕寬度，且不(b₹ ↔αù)進行(xíng)初始縮放(fàng)。代碼如←&(rú)下(xià)：這(zhè)段代碼支持Chrome、F•γirefox、IE9以上(shàng)的(de)浏覽器♠★(qì)，但(dàn)不(bù)支持IE8以及低(dī)于IE8的(¥☆¶αde)浏覽器(qì)。
在CSS文(wén)件(jiàn)尾部增λ§"±加針對(duì)不(bù)同屏幕分(fē & ®n)辨率的(de)規則。
例如(rú)使用(yòng)如(rú)下(xià)的(de)代ε↔☆碼，可(kě)以讓屏幕寬度低(dī)于4Ω∞80像素的(de)設備(如(rú)iPhone等)，網頁÷±→↑側欄隐藏中部內(nèi)容欄寬度自(zì★↕↕÷)動調節。以下(xià)代碼針對(duì)Z-Blog，W×♦∞∑ordPress相(xiàng)關标簽名稱隻需修改一(yī)♥γ¶下(xià)即可(kě)。
布局寬度使用(yòng)相(xiàng)對(duì)寬度。
網頁總體(tǐ)框架可(kě)以使用(y♣↕òng)絕對(duì)寬度，但(dàn)往下(xià)的(de)內(nèi)容↓✘框架、側欄等最好(hǎo)使用(yòng)相(xiàng)對(d>↕↑uì)寬度，這(zhè)樣針對(duì)不(bù)同分(fēn)辨率進行↑₹©(xíng)修改就(jiù)方便。當然也(yě)可(kě)以不←δ(bù)用(yòng)相(xiàng)對(duì)寬₹±≥÷度，那(nà)就(jiù)需要(yào)在@mediascre∏∞×enand(max-device-width:480px)裡™★(lǐ)面增加各個(gè)div的(de)針對(duì)小(∑φxiǎo)屏幕的(de)寬度，實際上(shàng)更麻煩★ε。
頁面使用(yòng)相(xiàng)對(duì)字體(tǐ)
在HTML頁面上(shàng)不(bù)要(yào)使用→ε(yòng)絕對(duì)字體(tǐ)(px)，而要(yào)使用(yòng↑&→)相(xiàng)對(duì)字體(tǐ)(em)，對(duì)于大±"(dà)多(duō)數(shù)浏覽器(qì)來(lái)說(shu±'£ō)，通(tōng)常用(yòng)em=px/16換算(suàn)，例如 •>(rú)16px就(jiù)等于1em。
根據上(shàng)面講述的(de€☆₹)幾點內(nèi)容，
邯鄲網絡公司首創網絡對(duì)CSS進行(xíng)了(le)一(♦"♥≠yī)些(xiē)修改，發現(xiàn)可(kě)•×™以從(cóng)iPhone手機(jī)浏覽到(d☆§εβào)體(tǐ)驗更佳的(de)頁面，但(dàn)有(yǒu)一(yī)個(gφ₩ è)問(wèn)題沒有(yǒu)解決，就(jiù)是∏₹ (shì)頂部導航欄navbar顯示有(yǒu)問(wènβ→)題，換行(xíng)後被下(xià)面的(αγde)文(wén)章(zhāng)蓋住了(÷♣πle)，不(bù)知(zhī)道(dào)怎樣能(néng)更好(hǎo®™✘)地(dì)解決這(zhè)個(gè)問(wèn)題(更新↔←♣≤：經過網友(yǒu)提示，在導航欄divNavbar的(de)樣™≈式裡(lǐ)，加入overflow:hidden;一(yī)行(x₩©<íng)即可(kě)解決這(zhè)個(γ≈gè)問(wèn)題)。
