本文实例讲述了css表头固定样式的方法。分享给大家供大家参考。
3 P0 v: T7 }( p) f具体实现方法如下:% [$ t" y1 n) K; k' n E: H
代码如下:0 k3 [$ N, x2 W8 H( k
<style type=text/css>, _# j0 `' e6 n+ c. z) g$ e- z/ P0 T
/*表头样式*/( P( r+ Y* O, C$ ]) s. A
.scll {0 S4 {9 a8 }# A7 T& o! K
position: relative;
# ^. f+ ~! E: U$ e3 W* c8 I) ktop: expression(this.offsetparent.scrolltop);
8 x6 o, {& H4 t5 `) g# j! N" T//background: url(../img/tab_15.gif) repeat-x left;4 T/ ?# I3 f- l* \: b
background-color: #bcf4ec;8 t& P n- |8 \ B$ e6 x8 W
text-align: center;3 n+ |! ]) \0 U' `! z& n
vertical-align: middle;
0 N( o/ A& E% K0 g- \1 h! A' ptext-indent: 5px;
3 _1 M; |& p1 _* A# _# a}4 K' B; {' M; s6 ?( h x8 @; u
/*div样式*/# d5 s; g( ?/ t' h% l4 L7 Z
.h_500 {
) J8 p" x1 l/ f1 I5 B$ awidth: 100%;$ d) K, E6 s5 K, X7 g/ V. l
overflow: auto;
2 o- X' ~+ `# p/ H W9 I, jheight: 80%;/**根据具体的屏幕分辨率调整*/1 q) a& t1 v2 {/ D
border: 0px;0 V4 l$ B9 |$ y% ]% y" {
}
: c8 W6 `& X' k3 R! D/*细线表格*/$ U! r2 | h# \4 o. g! i
.table {
1 E4 _7 {7 h$ W4 U) y; imargin-top: 0px;
8 i; r) ?, I- G: mmargin-bottom: 3px;$ o8 I; B/ T' |+ [6 i" m$ \
margin-bottom: 3px;! u& ~3 h9 f4 S4 y( a
border-top: 0px;
, C3 p F2 _2 M+ C$ xborder-bottom: 1px solid silver;
% G9 S/ r) X2 c' f2 @2 @}3 N& G2 @; B0 S
</style> r5 q! v, U0 n. e* Y8 E: p$ p- _% i
希望本文所述对大家的css样式设计有所帮助。$ o# L. }0 g9 D& T
希望本文所述对大家的web前端设计有所帮助。
0 @; y8 D% }1 k5 B4 D3 k
7 }# N+ c! W/ @$ P更多网页制作信息请查看: 网页制作 |
|