css 實現 table斜線表頭

2021-08-28 01:38:52 字數 2210 閱讀 1071

border-left  border-right border-top border-bottom 能實現特殊形狀  

資費標準

title

>

<

style

type

="text/css"

>

table   

th, td   

th  /*模擬對角線*/  

.out   

b   

em   

.assessdetail td   

style

>

head

>

<

body

style

="background-color: #f0f0f6;color:#404040;"

>

<

table

>

<

tr>

<

thstyle

="width:200px;"

>

<

divclass

="out"

style

="font-size:27px"

>

<

b>

消費型別

b>

<

em>

通話型別

em>

div>

th>

<

th>

通話時長

th>

<

th>

虛擬幣th

>

tr>

<

trclass

="assessdetail"

>

<

td>

國內直撥

td>

<

td>

1 時長/分鐘

td>

<

td>

0.05/分鐘

td>

tr>

<

trclass

="assessdetail"

>

<

td>

國內回撥

td>

<

td>

2 時長/分鐘

td>

<

td>

0.1/分鐘

td>

tr>

<

trclass

="assessdetail"

>

<

td>

洛杉磯td

>

<

td>

1 時長/分鐘

td>

<

td>

0.2/分鐘

td>

tr>

<

trclass

="assessdetail"

>

<

td>

溫哥華td

>

<

td>

1 時長/分鐘

td>

<

td>

0.5/分鐘

td>

tr>

<

trclass

="assessdetail"

>

<

td>

香港td

>

<

td>

1 時長/分鐘

td>

<

td>

0.3/分鐘

td>

tr>

<

tr>

tr>

table

>

body

>

html

>

採用CSS實現Html斜線表頭

使用 的時候,經常會用到斜線表頭,如下圖所示。網上搜到的方法,通常是利用js實現斜線繪製。參考 這種方式比較麻煩,要動用js,有點殺雞用牛刀的感覺。於是,想著通過css實現表頭斜線。原理很簡單,就是通過css3的background size屬性實現背景自適應填充。背景為乙個16px 16px的斜線...

css實現table鎖定表頭

在做專案中,碰到 資料全部載入,不要分頁,就需要鎖定表頭的業務。自己也上網搜了一些資料,1.css html實現 一般的思路就是兩個table拼接,不過問題是上下表單可能對不齊 2.js實現 一般的思路是重新建立表頭,表頭浮動 在這裡css html實現 css html實現固定表頭title ty...

html實現帶斜線的表頭

在html jsp中經常用到table,但在table中如何實現標題 中畫斜線的操作呢?從網上查了很多資料,可以實現的方法有好幾種,現在提供一種簡單的操作方法,而且不用考慮解析度的問題,如圖 方法如下 該方法,實現的不是純粹的在table中畫斜線,而是實現兩種顏色的對比,實現出有斜線的感覺 doct...