. 你不
能定義行內(nèi)元素的寬度, 為了解決這個問題你可以將行內(nèi)元素轉(zhuǎn)變?yōu)閴K元素.span { width: 150px; display: block }三. 讓固定寬度的頁面居中
為了讓頁面在瀏覽器居中顯示, 需要相對定位外層div, 然后把margin設置為auto.
#wrapper {
margin: auto;
position: relative;
}四. 圖片替換技術(shù)
用文字總比用圖片做標題好一些. 文字對屏幕閱讀機和SEO都是非常友好的.
HTML:
Main heading one
CSS:h1 { background: url(heading-image.gif) no-repeat; }
h1 span {
position:absolute;
text-indent: -5000px;
}你可以看到我們對標題使用了標準的
作為標簽并且用css來將文本替換為圖片. text-indent屬性將文字
推到了瀏覽器左邊5000px處, 這樣對于瀏覽者來說就看不見了.
關(guān)掉css,然后看看頭部會是什么樣子的.帆力·得實針式打印機打印CSS頁面設計排版問題
五. 最小寬度
IE6另外一個bug就是它不支持 min-width 屬性. min-width又是相當有用的, 特別是對于彈性模板來說, 它們有
一個100%的寬度,min-width 可以告訴瀏覽器何時就不要再壓縮寬度了.
除IE6以外所有的瀏覽器你只需要一個 min-width: Xpx; 例如:
.container {
min-width:300px;
}為了讓他在IE6下工作, 我們需要一些額外的工作. 開始的時候我們需要創(chuàng)建兩個div, 一個包含另一個:
然后你需要定義外層div的min-width屬性.container {
min-width:300px;
}這時該是IE hack大顯身手的時候了. 你需要包含如下的代碼:
* html .container {
border-right: 300px solid #FFF;
}
* html .holder {
display: inline-block;
position: relative;
margin-right: -300px;
}
六. 隱藏水平滾動條
為了避免出現(xiàn)水平滾動條, 在body里加入 overflow-x:hidden .
body { overflow-x: hidden; }當你決定使用一個比瀏覽器窗口大的圖片或者flash時, 這個技巧將非常有用。
tholee集
新聞名稱:CSS網(wǎng)頁設計中常遇到的問題
文章位置:http://jinyejixie.com/news/197289.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供電子商務、企業(yè)網(wǎng)站制作、靜態(tài)網(wǎng)站、企業(yè)建站、品牌網(wǎng)站制作、商城網(wǎng)站
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源:
創(chuàng)新互聯(lián)