CSS控制Table內外邊框 顏色 大小示例

2022-09-25 07:27:09 字數 957 閱讀 9436

其實按照常理來說,現在的**應該早已經拋棄什麼**了,現在肯定是div+css當道嘛!不過客戶的**在新增內容的時候始終不滿意那些邊框效果:要麼沒有,要麼很粗。看得出來,這位客戶是位完美主義者。

在預設的情況下,我們的css將table的邊框清除掉了,是沒有的,看到的效果是這樣的。

無邊框table

為了給,**加乙個邊框,我在css裡面寫了這樣一句:

.table

哎,看來是我太天真了,瀏覽器裡看到的效果是這樣的:

只有外邊框的table

好吧,我承認,我確實已經有些年頭沒有動過table了,不過這完全不是我的責任,因為table其實已經被大眾設計師們拋棄了。於是我就刪掉那句css樣式,重新這樣寫了這樣一句:

.td 不過杯具依然發生,像客戶要求這麼細的人,怎麼能忍受table**的內邊框這麼粗呢?

內邊框很粗的table

沒有辦法,只好出絕招了,刪掉剛剛寫的程式設計客棧css**,直dgmjwvg接寫入:

.td.table

好了,這下看你還敢囂張?這不就乖乖地就範了嗎?

邊框很細的table

親密無間是沒有罪過的,但是文字內容和**邊框親密到沒有空隙就影響到美觀了,於是將剛剛那兩句**稍作修改:

.td.table

如果需要td兩邊都不需要那麼親密的話,就這樣寫:

.td.table

好了,現在來看看最後的效果吧,這個時候客戶已經非常開心了,他要的就是這個效果!

理想效果的table

如果大家在其他地方用到這樣的方法的時候,一定要注意css**的規範寫法:

不推薦:border-width:0 1 1 0;

最後還是提醒大家,能不用table就盡量不要用talbe吧,畢竟不是多麼先進的技術了,應該試著往div+css這方面努力!

本文標題: css控制table內外邊框、顏色、大小示例

本文位址: /web/css/80543.html

css設定內外邊框距離

margin屬性可以有一到四個值。p margin 25px 50px 75px 100px 上邊距為25px 右邊距為50px 下邊距為75px 左邊距為100px margin 25px 50px 75px 上邊距為25px 左右邊距為50px 下邊距為75px margin 25px 50px...

css盒模型。邊框和內外邊距

css盒模型 外邊距 邊框 內填充 內容 盒模型分為兩種 標準盒模型 怪異盒模型 ie盒模型 邊框 border border 10px solid blue 表示設定10畫素藍色實線條的邊框 是以下三個樣式的復合語法 border width 10px 設定邊框的寬度 border color b...

盒模型 內外邊距和邊框

盒模型 內容 內邊距 邊框 外邊距 如圖 邊框顏色 border color blue rgb 255,0,0 fff000 transparent 透明,預設值不常用可不記 邊框厚度 border width thin medium thick 1em 2px 0.1 thin 細邊框,mediu...