div和table的常用边框样式设置_div table加样式

1.div和table的边框演示设置

	<div class="divcss" style="width:100px;height:50px;border:1px solid #F00;">11111</div>
	<div class="divcss" style="width:100px;height:50px;border:1px solid #F00;">22222</div>
	<br/>
	<div class="divcss" style="border:2px dashed #F00;">33333</div>
	<br/>
	<div class="divcss" style="border-bottom:2px dashed #F00;">44444</div>
	<br/>
	<div class="divcss" style="border-left:2px solid #00F;">55555</div>
	<br/>
	<div class="divcss" style="border-right:2px solid #00F;width:200px;">66666</div>
	<br/>
	<div class="divcss" style="border-top:2px solid #00F;width:500px;">77777</div>
	<br/>
	<div class="divcss" style="border-top:2px solid #00F;width:500px;border-right:2px solid #00F;border-left:2px solid #00F;border-bottom:2px solid #00F;">88888</div>
	<br/>
	<table style="border-collapse: separate;border-spacing: 0px 0px;width:500px;text-align:center;" border="1">
		<tr style="background-color:#00F;color:white;">
			<td>a</td><td>b</td><td>c</td>
		</tr>
		<tr>
			<td>d</td><td>e</td><td>f</td>
		</tr>
		<tr>
			<td>g</td><td>h</td><td>i</td>
		</tr>
	</table>
	<br/>
	<table style="border: 1px solid black;width:500px;">
		<tr>
			<td>a</td><td>b</td><td>c</td>
		</tr>
		<tr>
			<td>d</td><td>e</td><td>f</td>
		</tr>
	</table>
	<br/>
	<table style="border-collapse: separate;border-spacing: 0px 0px;width:500px;text-align:center;" border="1">
		<tr>
			<td colspan="2">a合并</td><td>c</td>
		</tr>
		<tr>
			<td rowspan="2">d合并</td><td>e</td><td>f</td>
		</tr>
		<tr>
			<td>h</td><td>i</td>
		</tr>
	</table>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47