iT邦幫忙

2021 iThome 鐵人賽

DAY 13
0
影片教學

文組生的Python爬蟲之旅系列 第 13

Day13 HTML三

今天的影片內容為介紹一些常用的元素,像是插入超連結與圖片,以及表格的建立等~
一起來看看讓網頁變得更加吸睛的魔法吧!/images/emoticon/emoticon42.gif

P.S.建議大家將所有的HTML檔與圖片儲存在同一個資料夾

暑假於海生館拍攝的圖片,送給大家(請將此檔案命名為DSC_0394.jpg)

https://ithelp.ithome.com.tw/upload/images/20210927/20141397USDBTEfRvS.jpg

以下為影片中有使用到的程式碼

<!doctype html><!-- 請將此檔案存成HTML7.html -->
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>資料輸出1</title>
</head>
<body>

<header>
<h1>水母的秘密</h1>
<p>擷取自維基百科</p>
</header>

<section>
<h1>水母的壽命</h1>
<p>
水母生命週期十分複雜,壽命長短不一,相關研究也較為缺乏。<br>
最特殊的是燈塔水母,它能通過反覆通常生殖和轉分化達到「不老不死」。<br>
</p>
</section>

<section>
<h1>水母的天敵</h1>
<p>
鯊魚:鯊魚偶爾會捕食水母,但大部分的時候不會。<br>
玳瑁:目前已知玳瑁除了捕食小魚為生,另一食物來源為水母。<br>
海龜:捕食水母為生,海龜除了眼睛外,身體其他部分都可以抵抗水母的毒性,牠們在捕食水母時會閉上眼睛。<br>
曼波魚:捕食水母為生。<br>
紫螺:分布在熱帶太平洋溫暖的水域,愛吃漂浮在水面的水母。<br>
</p>
</section>

<footer>
<br>
<p>此網頁寫於2021某個天氣晴的午後</p>
<p>維基百科連結:https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%AF%8D</p>
</footer>

</body>
</html>
<!doctype html>
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>資料輸出2</title>
</head>
<body>
<h1>水母的基本介紹</h1>
<p>擷取自維基百科</p>
<br>
<p>水母是無脊椎動物,屬於刺胞動物門中的一類,其中包括水母、海葵、珊瑚、水螅。<br>
全世界的海洋中有超過兩百種的水母,牠們分布於全球各地的水域裡,無論是熱帶的<br>
水域﹑溫帶的水域﹑淺水區﹑約百米深的海洋,甚至是淡水區都有牠們的蹤影。</p>
</body>
</html>
<!doctype html>
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>資料輸出2</title>
</head>
<body>
<h1>水母的基本介紹</h1>

<p>擷取自<a href="https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%AF%8D">維基百科</a></p>

<br>
<p>水母是無脊椎動物,屬於刺胞動物門中的一類,其中包括水母、海葵、珊瑚、水螅。<br>
全世界的海洋中有超過兩百種的水母,牠們分布於全球各地的水域裡,無論是熱帶的<br>
水域﹑溫帶的水域﹑淺水區﹑約百米深的海洋,甚至是淡水區都有牠們的蹤影。</p>
</body>
</html>
<!doctype html>
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>資料輸出2</title>
</head>
<body>
<h1>水母的基本介紹</h1>
<p>擷取自<a href="https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%AF%8D">維基百科</a></p>
<br>
<p>水母是無脊椎動物,屬於刺胞動物門中的一類,其中包括水母、海葵、珊瑚、水螅。<br>
全世界的海洋中有超過兩百種的水母,牠們分布於全球各地的水域裡,無論是熱帶的<br>
水域﹑溫帶的水域﹑淺水區﹑約百米深的海洋,甚至是淡水區都有牠們的蹤影。</p>

<img src="DSC_039.jpg" alt="於海生館拍攝的水母" height="300" width="450">

</body>
</html>
<!doctype html><!-- 請將此檔案存成HTML11.html -->
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>資料輸出2</title>
</head>
<body>
<h1>水母在生物學中的分類1</h1>
<p>擷取自<a href="https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%AF%8D">維基百科</a></p>
<br>

<table border="1">

<thead>
    <tr><th>科學分類</th><th>類別名稱</th></tr>
</thead>

<tbody>
    <tr><td>界</td><td>動物界</td></tr>
    <tr><td>亞界</td><td>真後生動物亞界</td></tr>
    <tr><td>演化支</td><td>副同源異形基因動物</td></tr>
    <tr><td>演化支</td><td>	浮浪幼蟲樣動物</td></tr>
    <tr><td>門</td><td>刺胞動物門</td></tr>
</tbody>

</table>


</body>
</html>
<!doctype html>
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>資料輸出2</title>
</head>
<body>
<h1>水母在生物學中的分類</h1>
<p>擷取自<a href="https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%AF%8D">維基百科</a></p>
<br>
<h2>科學分類</h2>
<ul>
    <li>界--動物界</li>
	<li>亞界--真後生動物亞界</li>
	<li>演化支--副同源異形基因動物</li>
	<li>演化支--浮浪幼蟲樣動物</li>
	<li>門--刺胞動物門</li>
</ul>
   
</body>
</html>
<!doctype html>
<html lang="zh-tw">
<head>
    <meta charset="utf-8">
	<title>最終檔案</title>
</head>
<body>
<h1>水母的基本介紹</h1>
<p>擷取自<a href="https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%AF%8D">維基百科</a></p>
<br>
<p>水母是無脊椎動物,屬於刺胞動物門中的一類,其中包括水母、海葵、珊瑚、水螅。<br>
全世界的海洋中有超過兩百種的水母,牠們分布於全球各地的水域裡,無論是熱帶的<br>
水域﹑溫帶的水域﹑淺水區﹑約百米深的海洋,甚至是淡水區都有牠們的蹤影。</p>
<img src="DSC_0394.jpg" alt="於海生館拍攝的水母" height="300" width="450">
<ul>
    <li><a href="HTML11.html">水母在生物學中的分類</a></li>
	<li><a href="HTML7.html">水母的秘密</a></li>
</ul>
</body>
</html>

如果在影片中有說得不太清楚或錯誤的地方,歡迎留言告訴我,謝謝您的指教。


上一篇
Day12 HTML二
下一篇
Day14 CSS一
系列文
文組生的Python爬蟲之旅30

尚未有邦友留言

立即登入留言