HTML常見標籤詳解

劍指天涯心有夢發表於2018-05-25
HTML

iframe標籤

巢狀頁面

<iframe src="https://www.baidu.com" name="xxx"><iframe>

屬性

  1. height以畫素格式指定frame的高度
  2. width以百分比格式指定frame的寬度
  3. frameborder取值為1時（預設值），告訴瀏覽器在當前iframe與其他iframe之間繪製邊框，取0時則無需繪製此邊框。（一般寫做frameborder="0"）
  4. name嵌入的瀏覽上下文框架的名稱。該名稱可以用作<a>標籤,<form>標籤的target屬性值，或<input> 標籤和 <button>標籤的formtaget屬性值
  5. src巢狀頁面的URL地址。（支援相對路徑）

a標籤

跳轉頁面(HTTP GET 請求)

屬性

  1. target屬性

該屬性指定在何處顯示連結的資源。 取值為標籤（tab），視窗（window），或框架（iframe）等瀏覽上下文的名稱或其他關鍵詞。以下關鍵字具有特殊的意義:

  • _blank新視窗開啟
  • _self當前頁面載入
  • _parent載入響應到當前框架的HTML4父框架或當前的HTML5瀏覽上下文的父瀏覽上下文。
  • _top載入響應進入頂層瀏覽上下文
  1. download屬性

此屬性指示瀏覽器下載URL而不是導航到URL，因此將提示使用者將其儲存為本地檔案。如果http響應的Content-type寫成Content-type: application/octet-stream那麼瀏覽器就會以下載的形式接受請求（無需使用download屬性）

  1. href屬性
  • <a href="//qq.com"></a>a標籤的無協議絕對地址，當前頁面是什麼協議，跳轉頁面是什麼協議。
  • <a href="#xxx"></a>頁面內跳轉（不發起請求,除了錨點其餘均發起請求)可以使用href="#"或href="#"連結返回頁面頂部。
  • <a href=?name=xxx></a>瀏覽器發起?name=xxx的請求
  • <a href=./xxx.html></a>
  • <a href="javascript: alert(1);"></a>偽協議。                               如果要寫一個點選後不會跳轉的ａ標籤，可以寫為<a href="javascript:;"></a>

form標籤

跳轉頁面(HTTP POST 請求)

  • 如果form表單裡面沒有提交按鈕，就無法提交form。（除非你用JS）

屬性

  1. method
  • post:指的是HTTP，表單資料會包含在表單體內然後傳送給伺服器。
  • get:表單資料會附加在 action 屬性的URI中，並以 '?' 作為分隔符, 然後這樣得到的 URI 再傳送給伺服器。

action 一個處理這個form資訊的程式所在的URL。

input標籤

<input> 元素用於為基於Web的表單建立互動式控制元件，以便接受來自使用者的資料。

屬性

  1. type 控制元件型別的顯示。如果這個屬性沒有指定，預設的型別是 text。可用的值包括：
  • submit:用於提交表單的按鈕
  • button無預設行為按鈕
  • checkbox:核取方塊。（多個核取方塊需要給同一個name）
  • radio:單選按鈕。（多個單選按鈕需要給同一個name,否則可以同時選中）

button標籤

屬性

  1. type button的型別。可選值:
  • submit:此按鈕提交表單資料給伺服器。未指定時，此值為預設值

label標籤

它通常關聯一個控制元件，或者是將控制元件放置在label元素內

<label>使用者名稱<input type="text name="xxx"></label>

相關文章