p與span

大家在初學p+css布局時,有很多困惑,在p與span的使用過程沒覺得有一定的”章法”,覺得兩個區別不大,在w3c的關于p和span的定義:p作為分割文檔結構自然使它最官方的語義，但是這樣的官方語義太讓人迷惑，大的結構還
好，但是小的地方到底是用p還是用span仍然讓人迷惑。其實恰恰是《Microsoft MSDN Library》
里面的定義讓人豁然開朗。

p：指定渲染HTML的容器

span：指定內嵌文本容器

通俗地講就是如果里面還有其他標簽的時候就用p，如果里面只有文本就應該用span

p是一個塊級元素，用來為HTML文檔內大塊的內容提供結構和背景

span是行內元素，在行內定義一個區域（也就是一行內可以被 span 劃分好幾個區域）

p標簽中可以鑲嵌span標簽，（p可以看做是一個大容器，span是一個小容器，大容器當然可以放下一個小容器啦）

span與label

由于有了以上關于span的說法,那么我們就可以對文本進行span的容器操作了,可以定義css樣式什么的,但是label好像也可以?但是兩者區別有時什么呢?

label標簽主要用于綁定一個表單元素, 當點擊label標簽的時候, 被綁定的表單元素就會獲得輸入焦點

span則是對普通的文本的一種容器。

例子：

p id= pForm
p
span Did you visited my blog /span
input type= radio id= radYes name= visitedblog checked= checked /
label for= radYes Yes /label
input type= radio id= radNo name= visitedblog /
span
label for= radNo NO /label
(Press the text Yes or No not the radio) /span
/p
p
label accesskey= 1 for= textName Your Name: /label
input type= text id= txtName html' target='_blank'>value= Press Alt+1 /
/p
/p

運行結果：

有一個問題是：

accesskey這個屬性不是設置快捷鍵的么？可是按鍵1和alt+1都沒有反應，不知道什么情況，很是郁悶，希望高手可以給以解答label標簽accesskey的用法。

附：label標簽的具體用法：

label標記為標注標記，該標記支持與其他用戶交互式控件進行綁定，并代替被綁定控件觸發相應的事件，綁定的方法是：將for屬性值指定為目的控件（綁定控件）的ID。一般情況下，在使用單選框和復選框時用label綁定比較常見。
Label中兩個屬性非常有用，一個是for，一個就是accesskey
For屬性：
功能：表示Label標簽要綁定的HTML元素，你點擊這個標簽的時候，所綁定的元素將獲取焦點
用法：
label for= inputBox 姓名 /label
input id= inputBox type= text
Accesskey屬性：
功能：表示訪問label標簽所綁定的元素的熱鍵，當您按下熱鍵，所綁定的元素將獲取焦點。
用法： label for= inputBox accesskey= N 姓名 /label
input id= inputBox type= text
局限性：accessKey屬性所設置的快捷鍵不能與瀏覽器的快捷鍵沖突，否則將優先級或瀏覽器的快捷鍵。


注釋 ：
要將 LABEL 綁定到其它的控件，請將 LABEL 元素的 FOR 屬性設置為與該控件的 ID 相同。將 LABEL 綁定到控件的 NAME 屬性毫無用處。但是，要提交表單，你必須為 LABEL 元素所綁定到的控件指定 NAME。


有兩種方法給所指定的快捷鍵添加下劃線。LABEL 元素的 rich text 支持可以在 ACCESSKEY 屬性所指定的快捷鍵字符兩側加上 U 元素。如果你更愿意使用樣式表(CSS)來應用樣式，可以將該字符包含在 SPAN 中，并設置樣式為“text-decoration: underline”。


如果用戶單擊 LABEL，則會先觸發 LABEL 上的 onclick 事件，然后觸發由 htmlFor 屬性所指定的控件上的 onclick 事件。按下 LABEL 設定的快捷鍵將設置焦點但并不觸發 onclick 事件。


標簽不允許嵌套。


此元素在 Internet Explorer 4.0 及以上版本的 HTML 和腳本中可用。


此元素是內嵌元素。


此元素需要關閉標簽。

以上就是HTML中Div、span、label標簽的區別的詳細內容，html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。