最終成果:
我的代碼:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>The blah</title>
<link rel="stylesheet" type="text/css" href="homework.css">
</head>
<body>
<div class="header">
<img src="images/blah.png">
<ul class="nav">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">Site</a>
</li>
<li>
<a href="#">Other</a>
</li>
</ul>
</div>
<div class="main-content">
<h2 style="text-align: center">The Beach</h2>
<hr/>
<ul class="photos">
<li>
<img src="images/0001.jpg" width="150" height="150" alt="pic1">
</li>
<li>
<img src="images/0003.jpg" width="150" height="150" alt="pic2">
</li>
<li>
<img src="images/0004.jpg" width="150" height="150" alt="pic3">
</li>
</ul>
<p>stretching from Solta to Mljet, and this unique cycling trip captures the highlights with an ideal balance
of activity, culture and relaxation. Experience the beautiful island of Korcula with its picturesque old
town, the untouched beauty of Vis, and trendy Hvar with its Venetian architecture. In the company of a
cycling guide, this stimulating journey explores towns and landscapes, many of which are on UNESCO's world
heritage list. Aboard the comfortably appointed wooden motor yacht, there is ample time between cycles to
swim in the azure waters and soak up the ambience of seaside towns.</p>
</div>
<div class="footer">
<p>@ Mugglecoding</p>
</div>
</body>
</html>
總結(jié):
1.常用HTML標簽的用法:
?HTML 標題(Heading)是通過 <h1>標題 <h6> 等標簽進行定義的给猾。從h1到h6標題的字號依次變小,而且只有這六個等級
標簽<p>段落</p>定義段落
標簽,<a ></a>?定義鏈接
標簽<ul>導航</ul>定義導航
標簽<img src="圖片地址"?width=“寬度”淤齐,?height=“高度”>定義圖片,width和height可以不寫,就按照圖片的原樣大小插入圖片
注意:標簽一般都是成對出現(xiàn)的,所以最好都用成對的標簽