【卜維丰】用 CSS3 美化表單分組(fieldset)
fieldset { |
02 |
border:0; |
03 |
padding:10px; |
04 |
margin-bottom: |
05 |
10px;background:#EEE; |
06 |
07 |
border-radius: 8px; |
08 |
-moz-border-radius: 8px; |
09 |
-webkit-border-radius: 8px; |
10 |
11 |
background:-webkit-liner-gradient(top,#EEEEEE,#FFFFFF); |
12 |
background:linear-gradient(top,#EFEFEF,#FFFFFF); |
13 |
14 |
box-shadow:3px 3px 10px #666; |
15 |
-moz-box-shadow:3px 3px 10px #666; |
16 |
-webkit-box-shadow:3px 3px 10px #666; |
17 |
18 |
position:relative; |
19 |
} |
20 |
21 |
legend { |
22 |
padding:5px 10px; |
23 |
background-color:#4F709F; |
24 |
color:#FFF; |
25 |
26 |
border-radius:3px; |
27 |
-moz-border-radius:3px; |
28 |
-webkit-border-radius:3px; |
29 |
30 |
box-shadow:2px 2px 4px #666; |
31 |
-moz-box-shadow:2px 2px 4px #666; |
32 |
-webkit-box-shadow:2px 2px 4px #666; |
33 |
34 |
position:absolute; |
35 |
left:10px;top:-11px; |
36 |
} |