1、添加<div>標簽的代碼定義了兩個區塊的寬度和高度均為100px,邊框的格式也相同,只是區塊中顯示的內容不同;
2、添加<ul>和<ol>標簽分別用于定義無序列表和有序列表。<il>標簽位于<ul>標簽或<ol>標簽之下,一個<li>標簽表示列表中的一項。 無序列表中的<il>標簽在網頁中默認顯示為小圓點格式的項目符號;有序列表中的<li>標簽在網頁中默認顯示為數字符號;
3、<h>標簽用于定義標題,它分為<h1>到<h6>共六個標簽,<h1>字體號最大,<h6>字體號最小;
4、<a>標簽:用于定義鏈接,在網頁中單機鏈接,可以跳轉到<a>標簽中的href屬性指定的頁面地址;
5、<p>標簽:用于定義段落,不設置樣式時,一個<p>標簽的內容在網頁中顯示為一行;
6、<span>標簽:可以將網頁元素放在一行中顯示;
7、<img>標簽:主要用于顯示圖片,scr屬性指定圖片的地址,alt屬性指定圖片無法正常加載是的替換文本。
<!--
1、<!DOCTYPE html> 一個標準的網頁聲明,告訴瀏覽器用哪種規范來解讀當前文檔;
2、<html>標簽,聲明這是一個HTML文檔
3、<head>標簽,定義文檔的頭部
4、<meat>標簽,描述文檔的屬性
5、<title>標簽,定義文檔的標題
6、<body>標簽,定義文檔主體,包含文檔的所有內容
-->
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<!--
添加<div>標簽的代碼定義了兩個區塊的寬度和高度均為100px,邊框的格式也相同,只是區塊中顯示的內容不同
-->
<div style="height: 100px;width: 100px;border: 5px solid #500">第一個div</div>
<div style="height: 100px;width: 100px;border: 5px solid #500">第二個div</div>
<!--
添加<ul>和<ol>標簽分別用于定義無序列表和有序列表。<il>標簽位于<ul>標簽或<ol>標簽之下,一個<li>標簽表示列表中的一項。
無序列表中的<il>標簽在網頁中默認顯示為小圓點格式的項目符號;有序列表中的<li>標簽在網頁中默認顯示為數字符號
-->
<div><ul><li>第一條數據</li><li>第二條數據</li><li>第三條數據</li></ul><ol><li>第一條數據</li><li>第二條數據</li><li>第三條數據</li></ol>
</div>
<!--
<h>標簽用于定義標題,它分為<h1>到<h6>共六個標簽,<h1>字體號最大,<h6>字體號最小。
--><h1>h1標簽</h1><h2>h2標簽</h2><h3>h3標簽</h3><h4>h4標簽</h4><h5>h5標簽</h5><h6>h6標簽</h6>
<!--
<a>標簽:用于定義鏈接,在網頁中單機鏈接,可以跳轉到<a>標簽中的href屬性指定的頁面地址。
--><a href="https://www.baidu.com/">百度a標簽</a>
<!--
<p>標簽:用于定義段落,不設置樣式時,一個<p>標簽的內容在網頁中顯示為一行。
--><p>這是第一個p標簽</p><p>這是第二個p標簽</p>
<!--
<span>標簽:可以將網頁元素放在一行中顯示。
--><span>這是第一個span標簽</span><span>這是第二個span標簽</span>
<!--
<img>標簽:主要用于顯示圖片,scr屬性指定圖片的地址,alt屬性指定圖片無法正常加載是的替換文本。
--><img src="https://www.baidu.com/img/flexible/logo/pc/result@2.png" alt="加載失敗">
</body>
</html>
運行結果: