猿问

怎么将html的table表格第一行每个单元格向上移动不同距离。

本来想用margin-top取负,但是必须要有display:inline-block或block,但是会导致独占一行或重叠在一起。
怎么样才能使其每个单元只是垂直上移不同距离
///////////////////////////html///////////////////////
<table>
	<tr>
		<td class="td1"><img src="img/mini/mini1.png"><P>1111</P></td>
		<td class="td2"><img src="img/mini/mini2.png"><P>242</P></td>
		<td class="td3"><img src="img/mini/mini3.png"><P>2424</P></td>
		<td class="td4"><img src="img/mini/mini4.png"><P>32</P></td>
		<td class="td5"><img src="img/mini/mini5.png"><P>324</P></td>
		<td class="td6"><img src="img/mini/mini6.png"><P>332</P></td>
	</tr>
	<tr>
		<td><img src="img/mini/mini7.png"><P>2222</P></td>
		<td><img src="img/mini/mini8.png"><P>2</P></td>
		<td><img src="img/mini/mini9.png"><P>2</P></td>
		<td><img src="img/mini/mini10.png"><P>2</P></td>
		<td><img src="img/mini/mini11.png"><P>32</P></td>
		<td><img src="img/mini/mini12.png"><P>4</P></td>
	</tr>

/////////////////////////css/////////////////////////
.td1{
	width: 150px;
	margin-top: -300px;            //第一列每个单元格上移不同高度
}
.td2{
	width: 150px;
	margin-top: -350px;	
}
.td3{
	width: 150px;
	margin-top: -400px;	
}
.td4{
	width: 150px;
	margin-top: -350px;	
}
.td5{
	width: 150px;
	margin-top: -300px;	
}
.td6{
	width: 150px;
	margin-top: -250px;	
}


newsudhc3634140
浏览 3716回答 1
1回答

wsdzl

.td1{     width: 150px;     position:relative;     bottom:300px;            //第一列每个单元格上移不同高度 } .td2{     width: 150px;     position:relative;     bottom:350px;     } .td3{     width: 150px;     position:relative;     bottom:400px;   } .td4{     width: 150px;     position:relative;     bottom:350px;   } .td5{     width: 150px;     position:relative;     bottom:300px;   } .td6{     width: 150px;     position:relative;     bottom:250px;   }
随时随地看视频慕课网APP
我要回答