【Java Web】速通HTML

參考筆記： JavaWeb 速通HTML_java html頁面-CSDN博客

一、前言

1.網頁組成

1° 結構

2° 表現

3° 行為

2.HTML入門

1° 基本介紹

2° 基本結構

3. HTML標簽

1° 基本說明

2° 注意事項

4. HTML概念名詞解釋

二、HTML常用標簽匯總 + 案例演示

1. 字體標簽 font

（1）定義

（2）案例

2. 字符實體

（1）定義

（2）案例

3. 標題標簽 h

（1）定義

（2）案例

4. 超鏈接標簽 a

（1）定義

（2）案例

5. 列表標簽

5.1 無序列表 ul

（1）定義

（2）案例

5.2 有序列表 ol

（1）定義

（2）案例

6. 圖像標簽 img

（1）定義

（2）案例

7.表格標簽 table ??

（1）定義

（2）案例

8. 表單標簽 form ????

（1）定義

（2）常用的表單項標簽

（3）關于表單提交數據

（4）get請求和post請求的區別

9. p標簽

（1）定義

（2）案例

10. 布局相關標簽 div 和 span

（1）定義

（2）案例

三、總結

一、前言

1.網頁組成

1° 結構

HTML 是網頁內容的載體。"網頁內容"就是指網頁制作者放在頁面上想要讓用戶瀏覽的信息，包括文字，圖片，視頻等。如下就是基礎的沒有任何 CSS 樣式的 HTML 頁面

2° 表現

CSS 樣式是表現，就像網頁的外衣。例如：標題字體，顏色變化，或為標題加入背景圖片，邊框等。所有這些用來改變內容外觀的東西稱之為表現。如下就是在上面的 HTML 頁面中加入了 CSS 樣式，使得頁面更加好看

3° 行為

JavaScript 是用來實現網頁上的特效效果。例如: 鼠標滑過就彈出下拉菜單；或點擊某個按鈕頁面就發生跳轉；亦或者購物網站中圖片的輪換。一般地，有動畫，有交互的需求都是用 JavaScript 來實現的。如下所示：

2.HTML入門

1° 基本介紹

① HTML，全稱 HyperText Mark-up Language ，即超文本標記語言。HTML 文本是由 HTML 標簽組成的文本，可以包括文字，圖形，動畫，聲音，表格，鏈接等。HTML 的結構主要包括頭 Head 和身體 Body 兩大部分，其中頭部 Head 用于描述瀏覽器所需的信息，而身體 Body 則包含所要說明的具體內容

② HTML 文件不需要編譯，直接由瀏覽器進行解析執行

2° 基本結構

HTML 的基本結構如下圖所示：

3. HTML標簽

1° 基本說明

① HTML 標簽使用一對尖括號 <> 括起來；

② HTML 標簽一般都是雙標簽，如 <a></a>，前一個標簽是起始標簽，后一個標簽是結束標簽

③ HTML 中也有單標簽，單獨使用就能完整地表述信息。例如：換行標簽 、水平線標簽 <hr/>

④ 起始標簽 <> 內部的內容，稱為標簽的屬性，屬性值要用雙引號 "" 引起來。例如：
 你好，我是小馬 
上面代碼中的 color 即為標簽 的屬性，表示設置字體顏色

2° 注意事項

  ① 標簽不能交叉嵌套，必須始末對應

  ② 標簽必須正確關閉

  ③ 注釋不能嵌套

  ④ HTML 語法不嚴謹（不同瀏覽器的解析方式不盡相同，因此不能太嚴謹）。有時候標簽不閉合，屬性值不帶 "" 也不會報錯

4. HTML概念名詞解釋

① 標簽：這個前面解釋過了

② 屬性：起始標簽 <> 內部的內容，稱為標簽的屬性，屬性值要用雙引號 "" 引起來。例如：
你好,我叫小馬
上面代碼中，id、 color 即為標簽 的屬性

 ③ 文本：雙標簽中間的文字內容，包含空格換行等結構

 ④ 元素：經過瀏覽器解析后，每一個完整的標簽（標簽 + 屬性 + 文本）可以稱之為一個元素

二、HTML常用標簽匯總 + 案例演示

1. 字體標簽 font

（1）定義

font 是字體標簽，它可以用戶修改文本的字體、顏色，大小。其中：

face 屬性：修改字體的樣式

color 屬性：修改字體的顏色

size 屬性：修改字體的大小

PS : ① 標簽中的屬性沒有順序要求
② font 標簽已經過時，一般使用 CSS 來代替

（2）案例

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>Title</title></head><body><font face = "consolas" color = "blue" size = "16px">show your content</font></body>
</html>

運行效果：

2. 字符實體

（1）定義

在網頁上顯示的一些特殊符號，稱為字符實體，也叫符號實體

 常見特殊字符如下 :

 ①   —— 空格（每輸入一個，顯示一個空格)

 ② < —— 左尖括號 <

 ③ > —— 右尖括號 >

常用的字符實體表如下：

（2）案例

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>字符實體演示</title></head><body>&lt;hr/&gt;<hr/><!--水平線標簽--><font color = "blue" size = "16px">小馬&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;okk</font></body>
</html>

運行效果：

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/web/81758.shtml
繁體地址，請注明出處：http://hk.pswp.cn/web/81758.shtml
英文地址，請注明出處：http://en.pswp.cn/web/81758.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！