aⅴ一区二区三区无卡无码,潮中文字幕在线观看,中国大陆女BBWBBW,国产麻豆成AV人片在线观看,福利喷水导航,精品国产麻豆免费网站,午夜影院无码视频,亚洲人成无码综合网,毛片无码高潮喷白浆视频,亚洲精品国产成人

    制作網(wǎng)頁時(shí)我們經(jīng)常需要一些細(xì)的分隔線。我們通常的作法是用單元格填充背景來實(shí)現(xiàn)，這在一些時(shí)候當(dāng)然是不錯(cuò)的做法，但這樣做顯然不夠靈活：比如對(duì)長(zhǎng)度的控制不靈活、對(duì)位置的變換控制不靈活等。另一方面，正是因?yàn)檫@些單元格的存在，有時(shí)會(huì)把表格變得很復(fù)雜，從而難以維護(hù)。還有一種HTML自帶的分隔線就是＜HR＞，但它要占據(jù)一行的位置，在一些細(xì)致的布局上會(huì)很麻煩，而且它只是橫向的，而非縱向的。

　　而事實(shí)上，有一種看上去似乎很原始的方法被我們忽略了：用圖片。

　　你是不以為聽錯(cuò)了呢？沒有，就是用圖片！不要聽見圖片就覺得網(wǎng)頁會(huì)變得臃腫，關(guān)鍵是要看怎么用圖片。

　　一個(gè)黑色的1px×1px的圖片有多大？我可以告訴你：43字節(jié)，如右圖。（為了便于大家閱讀，我們將圖片顯示為20px×20px）我們就是用這樣一張圖片來實(shí)現(xiàn)靈活多變的分隔線。

　　來看下面實(shí)例：

　　隨心所欲控制長(zhǎng)短：

　　
　?。糹mg height=1 src="yl-021113-1-pic1.gif" width=100＞

　　
　　＜img height=1 src="yl-021113-1-pic1.gif" width=200＞

　　
　?。糹mg height=1 src="yl-021113-1-pic1.gif" width=300＞

　　隨心所欲控制粗細(xì)：
　　
　?。糹mg height=1 src="yl-021113-1-pic1.gif" width=300＞

　　
　?。糹mg height=2 src="yl-021113-1-pic1.gif" width=300＞

　　
　?。糹mg height=3 src="yl-021113-1-pic1.gif" width=300＞

　　縱向的？沒有問題：

　　　　　?。糹mg height=100 src="yl-021113-1-pic1.gif" width=1＞

　　　　＜img height=80 src="yl-021113-1-pic1.gif" width=2＞

　　　?。糹mg height=60 src="yl-021113-1-pic1.gif" width=3＞

　　聰明的你一定已經(jīng)明白了，上面的那些線就是用一張1px×1px的圖片強(qiáng)制定義尺寸實(shí)現(xiàn)的，是不很容易呢？而這張圖片只有43字節(jié)大?。?shí)現(xiàn)的過程**是強(qiáng)制定義一下尺寸，要比其他一些方法容易的多，用起來也靈活的多，因?yàn)樗梢噪S意定義尺寸，隨意更換位置。

　　接下來我們?cè)倏聪旅孢@個(gè)例子：

　　
　?。糹mg height=10 src="yl-021113-1-pic2.gif" width=300＞

　　這里筆者只是隨便做的一個(gè)例子，類似這種修飾條在網(wǎng)頁設(shè)計(jì)當(dāng)中還是比較常見的，通常的做法是做一個(gè)1px寬的小圖片，做為單元格的背景填充；或者是做成實(shí)際尺寸大小的圖片。

　　其實(shí)完全沒有必要做成實(shí)際尺寸大小的圖片，我們做成1px寬（高度是實(shí)際高度）的小圖片，然后強(qiáng)制定義一下尺寸就可以了。比如上例就是一張1px*10px的圖片，如右圖。（為了便于大家閱讀，我們將圖片顯示為8px×80px），放到網(wǎng)頁中時(shí)定義成300px*10px就可以了，或者你認(rèn)為這與填充成背景沒什么區(qū)別，的確，用的是同樣的圖片，但這樣做會(huì)更靈活，而不再受單元格的限制。如果是縱向的，道理是一樣的，就不再贅述。

　　一點(diǎn)小經(jīng)驗(yàn)，希望能夠?qū)Υ蠹矣杏谩?/P>

網(wǎng)頁設(shè)計(jì)小技巧:隨心所欲的分隔線，與大家多多交流。

查看更多寧波網(wǎng)站建設(shè)網(wǎng)頁設(shè)計(jì)小技巧隨心所欲