本文实例讲述了css表头固定样式的方法。分享给大家供大家参考。
- S4 d: u/ A+ c; W! B# Q具体实现方法如下:
) K9 c! l' v+ f6 T( }代码如下:, Z$ B' N: {4 |1 `
<style type=text/css>) Y+ f) C+ E+ d" t
/*表头样式*/
4 f8 Y& F9 @1 f. O: O.scll {/ R5 ]. n" z. S W
position: relative;$ P8 j, `/ T2 u8 |1 S2 G9 P
top: expression(this.offsetparent.scrolltop);( R: ~0 L! [9 g. I0 a2 j) _* f
//background: url(../img/tab_15.gif) repeat-x left;
/ d. G4 |) B/ t# M ^5 k l" X' \ cbackground-color: #bcf4ec;
3 G& K; R! W0 D; S P+ c9 u0 M* jtext-align: center;5 i! c- E! K8 t5 _; H3 {
vertical-align: middle;
7 {* e& V. h! r( x+ h1 ytext-indent: 5px;
/ K5 b7 o0 |9 p}
4 m, @' O& _. X9 e/*div样式*/
, S7 }) }+ l0 U2 I.h_500 {
, _5 {% `9 t5 p( B1 q+ dwidth: 100%;) M6 V+ A2 [) X) f; `
overflow: auto;6 _! _# M3 N/ n" _9 W
height: 80%;/**根据具体的屏幕分辨率调整*/0 }( d. j1 Y$ P% l, O. l# o+ D
border: 0px;7 N: `8 i& X2 F! i
}
/ g1 Y$ ~% K: g& f: ~, N/*细线表格*/
% k# P: x" R# D6 B* ]' y J, a.table {
# r% z! ~- {6 amargin-top: 0px;: ~- i, K' A7 [9 q5 P4 X: u- c
margin-bottom: 3px;! g2 b# y7 K6 N7 S( O% A# g6 ]# c
margin-bottom: 3px;3 h# N) j4 h- P. Y8 Y& D! a3 C
border-top: 0px;
$ w2 f9 I, P6 A7 l! @# x# W. J( }border-bottom: 1px solid silver;
& ?9 m/ V2 y/ [5 w2 @}
- P/ H; F) ~6 `0 ^5 I; r</style>
0 e- `4 H( }* s+ X% k希望本文所述对大家的css样式设计有所帮助。# a. h# @4 [6 i, `$ s, L
希望本文所述对大家的web前端设计有所帮助。
1 R5 q7 Y. v6 x) {4 w
! h: M" c, d7 x; O更多网页制作信息请查看: 网页制作 |
|