本文实例讲述了css表头固定样式的方法。分享给大家供大家参考。
* p0 ]# r/ T; H' |6 ^8 j- i; i具体实现方法如下:
! N: }6 Q) H9 I" K! R代码如下:
. C4 N( T! v W* e( m1 q3 q4 L8 N<style type=text/css>8 {- Q& P$ Q) C: o; Y6 H
/*表头样式*/
' ~" r8 ]7 ~) b; F.scll {
; ^% K) h% U& r0 aposition: relative;
3 s" R7 [" W& F& q3 Qtop: expression(this.offsetparent.scrolltop);
. E( F8 w8 l# V( G+ e//background: url(../img/tab_15.gif) repeat-x left;. b6 b, ]6 U/ H5 E& D
background-color: #bcf4ec;
( L3 u* w; S# c! X: xtext-align: center;
. a& `/ e7 C0 I/ @$ u$ }% P3 E9 yvertical-align: middle;
+ v5 v) `4 {$ \5 W# _ X$ Etext-indent: 5px;
# M# r: |. k6 V$ U2 `}/ n) N# B, Z2 O" S" G* x6 o
/*div样式*/
( n3 t; U7 [9 W5 M# n% V) \& f.h_500 {
1 l' P6 ^! K* ]3 s, k% f/ fwidth: 100%;3 f' `( ^* _) J$ z4 t6 c& b
overflow: auto;
: z- e! ?7 S9 I. Y) j1 T4 B: _height: 80%;/**根据具体的屏幕分辨率调整*/8 I: r/ c- O4 W5 `
border: 0px;5 v) v/ v% S$ L: b
}9 T4 b8 L! F( |9 c3 X4 E
/*细线表格*/0 o$ X; t" }' M4 Y2 I0 B) ^
.table {- B! r- \6 J7 m
margin-top: 0px;
- t- W. o _6 C6 {* i0 umargin-bottom: 3px;" U1 }$ k8 ^" u. ^. v
margin-bottom: 3px;+ r6 ^$ [, N# j8 Z, J1 U* S2 C l
border-top: 0px;
9 ^( l- p/ w! M! Mborder-bottom: 1px solid silver;% }3 t- u, X4 P% q5 N0 b
}& b+ C$ F5 `0 V6 S
</style>$ \ E0 G. e" }* [( e7 x. c; }
希望本文所述对大家的css样式设计有所帮助。
7 g1 Y/ h4 ]9 t希望本文所述对大家的web前端设计有所帮助。: `; p5 L5 B* [, f4 o
$ P; B) z0 g/ I3 }' y o
更多网页制作信息请查看: 网页制作 |
|