web前端零基礎教學html標籤（HTML前端常用標籤複習）

2023-08-05 11:46:09 1

1. HTML 初識HTML 指的是超文本標記語言 (Hyper Text Markup Language)是用來描述網頁的一種語言。HTML 不是一種程式語言，而是一種標記語言 (markup language)標記語言是一套標記標籤 (markup tag)

所謂超文本，有2層含義：

因為它可以加入圖片、聲音、動畫、多媒體等內容（超越文本限制 ）不僅如此，它還可以從一個文件跳轉到另一個文件，與世界各地主機的文件連接（超級連結文本 ）。

標題標籤段落標籤水平線標籤換行標籤無語義標籤和注:這兩個標籤在後期經常使用

文本格式化標籤

和文字加粗和斜體和加刪除線和加下劃線

圖片標籤

src 圖像路徑圖像標籤

該語法中src屬性用於指定圖像文件的路徑和文件名，他是img標籤的必需屬性。

屬性:

alt 文本,圖像不顯示時顯示文字

title 文本,滑鼠懸停時顯示內容

width 圖像寬度

height 圖像高度

border 設置圖像邊框寬度

連結標籤

文本或圖像

屬性：

錨點標籤

href (連結地址)必須寫	用於指定連結目標的url地址，（必須屬性）當為標籤應用href屬性時，它就具有了超連結的功能	1. 外部連結需要添加 http:// www.baidu.com2. 內部連結直接連結內部頁面名稱即可比如首頁 3.)，表示該連結暫時為一個空連結。4. 不僅可以創建文本超連結，在網頁中各種網頁元素，如圖像、表格、音頻、視頻等都可以添加超連結。
target (默認當前窗口打開,可新建窗口打開)	用於指定連結頁面的打開方式，其取值有self和blank兩種，其中_self為默認值，__blank為在新窗口中打開方式。

id=""

錨點定位

通過創建錨點連結，用戶能夠快速定位到目標內容。

第2集

使用相應的id名標註跳轉目標的位置。 (找目標)

base標籤

base 可以設置整體連結的打開狀態

base 寫到之間

預格式化標籤

文本

標籤可定義預格式化的文本。

所謂的預格式化文本就是，按照我們預先寫好的文字格式來顯示頁面，保留空格和換行等。

表格標籤

定義表格標籤定義表格行表格數據	border	設置表格邊框(默認border="0"無邊框)	單元格內的文字 ... ...
cellspacing	設置單元格與單元格之間的空白間距 (默認2像素)
cellpadding	設置單元格內容與單元格邊框之間的空白間距 (默認1像素)
width	設置表格的寬度
height	設置表格的高度
align	設置表格在網頁中的水平對齊方式 (三個屬性:left左 center中 right右 )	align="center"
caption	caption 元素定義表格標題，通常這個標題會被居中且顯示於表格之上。	個人信息表
rowspan="合併單元格的個數"	跨行合併	合併的順序我們按照先上後下先左後右的順序
colspan="合併單元格的個數"	跨列合併
表格標題標籤
標籤，他就像一個容器，可以容納所有的元素
一般表頭單元格位於表格的第一行或第一列，並且文本加粗居中
於定義表格的頭部。用來放標題之類的東西。內部必須擁有標籤！	以上標籤都是放到table標籤中。	更好的給表格劃分結構
用於定義表格的主體。放數據本體。	以上標籤都是放到table標籤中。
放表格的腳註之類。	以上標籤都是放到table標籤中。

列表標籤

列表(ul裡面只能包含li ,li裡面可以包含標籤)	無序列表	1. 中只能嵌套，直接在標籤中輸入其他標籤或者文字的做法是不被允許的。 2. 與之間相當於一個容器，可以容納所有元素。 3. 無序列表會帶有自己樣式屬性，放下那個樣式，一會讓CSS來！	裡面只能包含li 沒有順序，我們以後布局中最常用的列表
有序列表	所有特性基本與ul 一致。但是實際中比無序列表用的少很多。	裡面只能包含li 有順序，使用情況較少
名詞1 名詞1解釋1	自定義列表	裡面有2個兄弟， dt 和 dd

input控制項

text	單行文本輸入框
password	密碼輸入框
radio	單選按鈕
checkbox	複選按鈕
button	普通按鈕
submit	提交按鈕
reset	重置按鈕
image	圖像形式的提交按鈕
file	文本域
name	由用戶自定義	控制項的名稱	用戶名:
value	由用戶自定義	input控制項中的默認問本值	用戶名:
size	正整數	input控制項在頁面中的顯示寬度
checked 默認被選中	checked	定義選擇控制項默認被選中的項	女
maxlength	正整數	控制項允許輸入的最多字符數

用戶名：	第一種用法就是用label直接包括input表單。	當我們滑鼠點擊 label標籤裡面的文字時，光標會定位到指定的表單裡面
男	第二種用法 for 屬性規定 label 與哪個表單元素綁定。	當我們滑鼠點擊 label標籤裡面的文字時，光標會定位到指定的表單裡面

文本域

文本內容

通過textarea控制項可以輕鬆地創建多行文本輸入框.

cols="每行中的字符數" 我們實際開發不用

文本內容

select下拉列表

選項1 選項2 選項3 ...

在option 中定義selected =" selected "時，當前項即為默認選中項。

form表單域

各種表單控制項	action 屬性值:url地址	用於指定接收並處理表單數據的伺服器程序的url地址。
method 屬性值:get/post	用於設置表單數據的提交方式，其取值為get或post。
name 屬性值:名稱	用於指定表單的名稱，以區分同一個頁面中的多個表單。

以上標籤基本包含了前端開發所需常用標籤.來自本人,黑馬程式設計師.傳智播客學習筆記.