博客列表 >0322作业

0322作业

烟火的博客
烟火的博客原创
2018年03月26日 01:24:55931浏览
实例
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>0322作业</title>
	<style type="text/css">
		table{
			margin: auto;/*表格居中*/
			border-collapse: collapse;
			box-shadow: 3px 3px 3px #888;
			width: 60%;
			background-image: url(images/bc.png); 
			background-repeat: no-repeat;
		}
		table,th,td{
			border: 1px solid black;
			text-align: center;
		}
		table caption {
			font-size: 1.6em;
			font-weight: border;
			margin-bottom:15px;
			margin-top: 10px
		}
		td,th {
			padding: 4px;

		}
		.left {
			text-align: left;
		}
		} 
		img {
			border-radius: 50%;
			box-shadow: 2px 2px 2px #888;
		}
		th{
			background-color: rgba(180,180,0,0.3);
		}
	</style>
</head>
<body>
	<table>
		<caption>2017财富排行榜</caption>
		<tr>
			<th>序号</th>
			<th colspan="2">头像姓名</th>
			<th>行业</th>
			<th>财富值(亿)</th>
			<th>国籍</th>
		</tr>
		<tr>
			<td>1</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">比尔·盖茨</td>
			<td>微软</td>
			<td>860</td>
			<td>美国</td>
		</tr>
		<tr>
			<td>2</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">沃伦·巴菲特</td>
			<td>伯克</td>
			<td>756</td>
			<td>美国</td>
		</tr>
		<tr>
			<td>3</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">杰夫·贝佐斯</td>
			<td>亚马逊</td>
			<td>728</td>
			<td>美国</td>
		</tr>
		<tr>
			<td>4</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">阿曼西奥</td>
			<td>Zara</td>
			<td>713</td>
			<td>西班牙</td>
		</tr>
		<tr>
			<td>5</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">马克·扎克伯格</td>
			<td>facebook</td>
			<td>560</td>
			<td>美国</td>
		</tr>
		<tr>
			<td>6</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">卡洛斯</td>
			<td>电信</td>
			<td>545</td>
			<td>印度</td>
		</tr>
		<tr>
			<td>7</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">拉里</td>
			<td>软件</td>
			<td>522</td>
			<td>法国</td>
		</tr>
		<tr>
			<td>8</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">查尔斯</td>
			<td>石油</td>
			<td>483</td>
			<td>荷兰</td>
		</tr>
		<tr>
			<td>9</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">迈克尔</td>
			<td>彭博</td>
			<td>483</td>
			<td>德国</td>
		</tr>
		<tr>
			<td>10</td>
			<td colspan="2" class="left"><img src="images/bill2.png" width="35">谢尔盖</td>
			<td>Google</td>
			<td>475</td>
			<td>英国</td>
		</tr>
	
	</table>
</body>
</html>
运行实例 »
点击 "运行实例" 按钮查看在线实例


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议