1. 程式人生 > >HTML 第二章 作業

HTML 第二章 作業

課後作業
1.無序列表 有序列表 定義列表適用的場合分別是什麼?
無序列表使用專案符號來記錄無序的專案
有序列表使用編號來記錄專案的順序
定義列表它由兩個部分組成:定義條件和定義描述
2.表格的跨行,跨列分別使用哪些屬性?要實現一個3行2列的單元格需要哪幾個步驟?
表格跨行屬性:rowspan
表格跨列屬性:colspan
實現一個3行2列程式碼如下:

<td rowspan=“3”,colspan=“2”>標籤內容</td>

3.HTML5中的媒體元素有哪些?怎麼實現不同的瀏覽器都能播放
HTML5音訊元素有audiovideo元素,用source引入audiovideo

元素可以實現不同瀏覽器都支援播放
4.製作百度知道頁面中的"品牌全知道"版塊
程式碼如下:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>品牌全知道</title>
	</head>
	<body>
		<img src="img/iknowshouye.jpg"/>
		<p>
			<h3>品牌全知道</h3>
			<ul>
				<li><img src="img/icon-1.jpg"/>&nbsp;&nbsp;理膚泉敏全知道</li>
				<li><img src="img/icon-2.jpg"/>&nbsp;&nbsp;薇姿健康肌膚全知道</li>
				<li><img src="img/icon-3.jpg"/>&nbsp;&nbsp;中信銀行全知道</li>
				<li><img src="img/icon-4.gif"/>&nbsp;&nbsp;Windows7全知道</li>
				<li><img src="img/icon-5.jpg"/>&nbsp;&nbsp;海信電視全知道</li>
				<li><img src="img/icon-6.jpg"/>&nbsp;&nbsp;多美滋全知道</li>
				<li><img src="img/icon-7.jpg"/>&nbsp;&nbsp;三星手機全知道</li>
			</ul>
		</p>
	</body>
</html>

5.使用HTML5的元素結構佈局頁面
程式碼如下:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>貴美商城</title>
		<style type="text/css">
			.a {
				margin: 0px auto;
				width: 1480px;
				height: 150px;
				border: 2px solid;
			}
			
			.b {
				margin: 0px auto;
				width: 1480px;
				height: 345px;
				border: 2px solid;
			}
			
			.div {
				border: 1px solid;
			}
		</style>
	</head>

	<body>
		<div class="div	">
			<p>
				<header class="a">
				</header>
			</p>

			<section class="b">
			</section>

			<p>
				<footer class="a">
				</footer>
			</p>
		</div>
	</body>

</html>