在網頁中實現細線邊框的兩種方法(轉)
在網頁中實現細線邊框的兩種方法(轉)[@more@]
很多朋友都有過製作網頁的經歷,如今,眾多網頁的設計都用到了表格。這樣不僅有利於網頁的維護,同時,提高了網頁的觀賞性。在眾多網頁製作風格中,細邊框這個製作方法是必不可少的。這裡,我將簡單地談一下細邊框的製作方法。 談到細邊框,本人認為大致有兩種製作方法,第一種是用表格的巢狀,第二種是用CSS強制定義。 如何用表格巢狀呢?大家都知道,用Bgcolor可以在表格中任意定義表格的背景顏色,用Cellspacing可以控制表格單元的額外空間,如果定義兩個表格,把其中一個的表格背景設為全黑,然後在這個表格中巢狀定義另外一個表格,背景設為全白,並且把Weight=100%。這時,兩個表格是重疊的,但是,如果把背景為黑色的那個表格再定義一個Cellspacing=1。那麼就是說,黑色的表格比白色的表格多出了一個畫素的外圍空間,而白色的表格又在黑色表格之上,從而達到細邊框的效果。原始碼如下: 〈table border="0" cellpadding=0 cellspacing=1 bgcolor=black〉 〈tr〉 〈td〉 〈table width="100%" border="0" cellpadding=0 cellspacing=0 bgcolor=white〉 〈tr〉 〈td〉 〈/td〉 〈/tr〉 〈/table〉 〈/td〉 〈/tr〉 〈/table〉 第二種比較簡單,那就是用CSS(層疊樣式表)強制定義,但是,有些比較老的瀏覽器不支援CSS,可能導致無法顯示你所要求的效果。不過使用CSS定義,語句非常簡潔,所作網頁的容量也較小。它的操作方法是,在表格的最外圍的相應最小單元的〈td〉標籤中定義style="BORDER-postion: black 1px solid;",其中,Postion的引數有Left、Right、Top和Bottom,分別表示在單元的左、右、上、下顯示一條1個畫素寬的實線條。 原始碼如下: 〈table border="0" bgcolor=white〉 〈tr〉 〈td style="BORDER-left: black 1px solid; BORDER-top: black 1px solid;"〉 〈/td〉 〈td style="BORDER-top: black 1px solid; BORDER-right: black 1px solid;"〉 〈/td〉 〈/tr〉 〈tr〉 〈td style="BORDER-left: black 1px solid; BORDER-bottom: black 1px solid;"〉 〈/td〉 〈td style="BORDER-bottom: black 1px solid; BORDER-right: black 1px solid;"〉 〈/td〉 〈/tr〉 〈/table〉
|
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/8225414/viewspace-957447/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 表格細邊框的兩種CSS實現方法CSS
- 表格邊框探祕table及如何快速實現細線表格
- 1px 邊框的實現方法
- CSS實現漸變色邊框(Gradient borders)的5種方法CSS
- CSS border-collapse 細線邊框CSS
- 用css實現自定義虛線邊框CSS
- 【基礎】CSS實現多重邊框的5種方式CSS
- Android 頁面跳轉動畫的兩種實現方式Android動畫
- 兩種Delphi實現Singleton模式方法 (轉)模式
- 成品直播原始碼,html頁面點選按鈕實現頁面跳轉的兩種方法原始碼HTML
- PHP頁面跳轉幾種實現方法PHP
- python用兩種方法實現url短連線Python
- css實現的交叉邊框效果CSS
- 網頁頂部陰影邊框效果網頁
- CSS3邊框旋轉動畫實現效果CSSS3動畫
- Python 爬取網頁資料的兩種方法Python網頁
- css實現四種常見邊框內外角組合CSS
- C#實現Web檔案上傳的兩種方法(轉)C#Web
- 在MVC中實現 網頁錯誤跳轉到500統一頁面MVC網頁
- 如何實現在指定的時間後網頁實現跳轉網頁
- Android學習之 圓角邊框的幾種實現方式Android
- CSS實現流動邊框CSS
- Oracle中spool命令實現的兩種方法比較-入門Oracle
- 做實驗驗證MongoDB分頁的兩種方法MongoDB
- 如何實現特殊的邊框樣式
- 在Linux系統中儲存裝置的兩種表示方法(轉)Linux
- Spark SQL中列轉行(UNPIVOT)的兩種方法SparkSQL
- 實現AS3的Singleton的兩種方法S3
- 邊框檢測在 Python 中的應用Python
- 在儲存過程中建立表的兩種方法儲存過程
- 一種實現資料庫連線池的方法(JAVA) (轉)資料庫Java
- css實現邊框陰影效果CSS
- vue 跳轉的兩種方法Vue
- 兩種方法使vue實現jQuery呼叫VuejQuery
- 兩種方法獲取網頁編碼python版網頁Python
- RabbitMQ實現延時訊息的兩種方法MQ
- 取得ie詳細版本資訊.及其它版本資訊的兩種方法. (轉)
- 在Java中實現遠端方法呼叫(轉)Java