第六次作业
代码：
实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>作业</title>
<style type="text/css">
table,th,td {
border: 1px solid #336;
}
table {
border-collapse: collapse;
text-align: center;
width: 60%;
/*设置居中*/
margin: 50px auto;
box-shadow: 3px 3px 3px #888;
background-image: url(../image/1.jpg);
background-size: cover;
}
table caption {
font-size: 80px;
font-weight: bolder;
margin-bottom: 40px;
}
th,td {
padding: 15px;
}
td img {
border-radius: 50%;
box-shadow: 2px 2px 2px #888;
}
th {
color: gold;
font-weight: bolder;
font-size: 1.2em;
}
#no1 {
color: red;
}
</style>
</head>
<body>
<table>
<caption>营养蔬菜</caption>
<tr>
<th>序号</th>
<th>名称</th>
<th>照片</th>
<th>营养价值</th>
<th>吃法</th>
<th>价格</th>
</tr>
<tr>
<td>1</td>
<td>甘蓝</td>
<td><img src="../image/cai.jpg" alt="蔬菜" width="50"></td>
<td>维生素K有助于血小板凝结。</td>
<td>加入柠檬、大蒜和少量水一起煮。</td>
<td id="no1">5块钱每斤</td>
</tr>
<tr>
<td>2</td>
<td>菠菜</td>
<td><img src="../image/cai.jpg" alt="蔬菜" width="50"></td>
<td>含有维生素A、锰、叶酸、镁、钙和铁以及类黄酮和类胡萝卜素。</td>
<td>菠菜熟吃更有营养。吃法比较随意，可以爆炒或做汤。</td>
<td id="no1">3块钱每斤</td>
</tr>
<tr>
<td>3</td>
<td>南瓜</td>
<td><img src="../image/cai.jpg" alt="蔬菜" width="50"></td>
<td>南瓜心的胡萝卜素含量是果肉的5倍。</td>
<td>加入其他蔬菜或肉食，做成南瓜饼，甜咸皆宜。</td>
<td id="no1">10块钱每斤</td>
</tr>
<tr>
<td>4</td>
<td>西兰花</td>
<td><img src="../image/cai.jpg" alt="蔬菜" width="50"></td>
<td>热量低，纤维含量高，维生素C比大白菜、番茄和芹菜更高。</td>
<td>凉拌或加入沙拉中。</td>
<td id="no1">6块钱一斤</td>
</tr>
</table>
</body>
</html>运行实例 »
点击 "运行实例" 按钮查看在线实例
手抄：
