HTML筆記
HTML檔案
<!DOCTYPE html>
<html>
<head>
<!--網頁編碼-->
<meta charset="UTF -8"></meta>
<meta name="description" content = "測試文字"/>
<meta name="author" content = "測試文字"/>
<meta name="keywords" content = "測試文字"/>
<meta name="viewport" content = "width=device-width, initial-scale=1.0" />
<title>測試網站</title>
</head>
<body>
hello world
<!--基本標籤-->
<h1>H1標題</h1>
<p>h1測試<b>文字</b></p>
<br/>
<h3>H3標題</h3>
<br/>
<hr/>
<br/>
<h2>H2標題</h2>
<p>h2測試<i>文字</i></p>
<!--連接&照片-->
<a href="http://google.com">google網站</a>
<a href="page2.html">第二頁</a>
<a href="dir/page3.html">第三頁</a>
<a href="pig.JPG">豬</a>
<br/>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQftFpjLgzAH2O59JHIjJUGivb9awDV1sqN6Q&usqp=CAU"/>
<img src="pig.jpg" width="400" />
<!--影片 & 嵌入影片-->
<video src="myvideo.mp4" controls height="400">無法載入影片</video>
<iframe width="560" height="315" src="https://www.youtube.com/embed/CLUPkcLQm64" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<!--列表 & 表格-->
<ol type="I">
<li>google</li>
<li>facebook</li>
<li>ig</li>
<li>ptt</li>
</ol>
<table>
<tr>
<td>日期</td>
<td>數學</td>
<td>英文</td>
</tr>
<tr>
<td>2/8</td>
<td>80</td>
<td>60</td>
</tr>
<tr>
<td>2/9</td>
<td>60</td>
<td>70</td>
</tr>
</table>
<!--html的容器 div & span-->
<div style="color:red;">
<table>
<tr>
<td>日期</td>
<td>數學</td>
<td>英文</td>
</tr>
<tr>
<td>2/8</td>
<td>80</td>
<td>60</td>
</tr>
<tr>
<td>2/9</td>
<td>60</td>
<td>70</td>
</tr>
</table>
</div>
<br/>
<span>span1</span>
<span>span2</span>
<hr/>
<div>div1</div>
<div>div2</div>
<!--html輸入標籤-->
<input type="text" placeholder="請輸入帳號" />
<br/>
<br/>
<input type="password" placeholder="請輸入密碼" />
<br/>
<br/>
<input type="range" />
<br/>
<br/>
<input type="date" />
<br/>
<br/>
<input type="file" />
<br/>
<br/>
<input type="checkbox" />
<br/>
<br/>
<textarea>你好</textarea>
</body>
</html>
