常用的HTML標簽詳解與總結

DobbyKim 發布于2019-08-02 16:06 / 3268人閱讀

摘要：今天，我們就來詳細介紹常用的標簽。標簽對文字字符進行換行處理。標簽加入水平分割線。標簽語義強調，表示重視。標簽有序列表標簽。即定義描述，用于添加該名詞的具體解釋。標簽用來顯示圖片。默認內容標簽下拉列表，以和兩個標簽配合完成。

對于很多HTML初學者來說，記憶和掌握標簽是一門很難搞的功課。今天，我們就來詳細介紹常用的HTML標簽。

對于標簽的掌握，更多的是要通過練習，熟能生巧。

stlye標簽

用于定義元素的CSS樣式

script標簽

用于定義頁面的JavaScript代碼，也可以引入外部的JavaScript文件。

link標簽

引入外部樣式css文件。

HTML注釋

又叫注釋標簽。

對關鍵代碼注釋是一個良好的習慣。在實際開發中，對功能模塊代碼進行注釋尤為重要。

h(標題)標簽

共有六個級別的標題標簽：h1、h2、h3、h4、h5、h6。其中h是header的縮寫。

這里要注意，一個頁面一般只有一個h1標簽，表示頁面的大標題。

hearder 1
hearder 2
...

p(段落)標簽

我們可以用來顯示一個段落的文字。

Paragraph

br標簽

對文字字符進行換行處理。

hr標簽

加入水平分割線。

strong標簽

語義強調，表示重視。同時字符加粗。

xxx

div標簽

全稱“division(分區)”，用來劃分一個區域。div標簽內部可以放入所有其他標簽，例如p標簽、strong標簽等。


   I love study.

span標簽

段落式標簽，和div非常像。但是div是塊級元素，而span是內聯元素。

xxx

空格

表示一個空格。

ol標簽

有序列表標簽。默認以數字順序。

表示一個列表項。


  first
  second
  third

ul標簽

無序排列標簽，即unordered list。


  first
  second
  third

dl標簽

定義列表，即definition list。引入兩個概念，dt和dd。

dt即definition term(定義名詞)，用于添加要解釋的名詞。

dd即definition description(定義描述)，用于添加該名詞的具體解釋。


  term
  description

table標簽

一個表格一般由幾個部分組成。

表格：table標簽

行：tr(table row)標簽

單元格：td(table data cell)標簽

標題：caption標簽

表頭單元格：th(table header cell)標簽

一般為了使表格語義化結構更清晰也更有可讀性和維護性，引入thead、tbody、tfoot三個標簽，把表格劃分為三部分：表頭、表身、表腳。

xxx
xxx	xxx
xxx	xxx
xxx	xxx
xxx	xxx

img標簽

用來顯示圖片。有三個屬性值：src、alt、tittle。

a標簽

超鏈接標簽。主要有兩個屬性值：href和target。

target屬性取值：

_self 默認值，在當前窗口打開鏈接

_blank 在新窗口打開鏈接

_parent 在父窗口打開鏈接

_top 在頂級窗口打開鏈接

form標簽

表單標簽。


  /*各種表單標簽*/

一般常用的屬性有name和target兩個。

在一個頁面中一般不止一個表單。為了區分這些表單，我們使用name來對表單進行命名。每個form標簽對應一個表單。

method屬性用于指示表單數據使用哪一種http提交方法。取值有兩個：get和post。一般使用post，向服務器提交時加密，安全性高。

input標簽

多數表單都用input標簽來實現，是自閉合標簽。

下面介紹標簽的幾種type屬性。

text

單行文本框。

name:

password

密碼文本框。一種特殊的單行文本框，輸入時不可見。

password:

radio

單選框。name屬性表示單選按鈕所在組名，value表示按鈕取值。

Gender：
 Male
 Female

checkbox

復選框。

checked屬性表示默認選取。

Fruit:
 Apple
 Banana
 Lemon

button

普通按鈕，一般配合JavaScript進行操作。

submit

提交按鈕。

reset

重置按鈕，只可以重置同一表單中的輸入內容。

button標簽

和input標簽中的button實現效果類似，不過此標簽在不賦予屬性時會自動升級為提交按鈕。

textarea標簽

多行文本框。默認文本是在標簽內部設置的，而不是在value中。rows和cols屬性可以調整文本框的行數列數，但一般使用css來設置寬高。

默認內容

select/option標簽

下拉列表，以select和option兩個標簽配合完成。

select屬性有：

multiple 設置下拉列表可以選擇多項。

size 設置下拉列表顯示幾個項，取值整數。

option屬性有：

selected 設置該選項默認。

disabled 設置該選項不可選。

iframe標簽

可以用來實現內嵌框架，以及配合超鏈接來使用。

或者


<a href="xxx" target="_blank"></a>

Written by：EdenSheng
Email：singlesaulwork@gmail.com

GPU云服務器云服務器 html常用的空標簽 html常用標簽 html常用單標簽 html基本常用標簽

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/54680.html

HTML中的meta標簽常用屬性及其作用總結

摘要：元素父元素屬性中的變化為中新增的，用來聲明字符編碼屬性在中有很多值，在中只有可用具體用途元素出去屬性外，都是屬性或屬性結合來使用指定名值對定義元數據屬性與屬性結合使用用來表示元數據的類型，表示當前標簽的具體作用屬性用來提供值。文章同步到github 以前沒怎么太注意過meta標簽的作用，只是簡單了解一些常用屬性，現在結合個人了解的進行記錄與總結: 元數據首先需要了解一下元數據(me...

Keven 2019-08-01 17:15 評論0 收藏0
Java學習路線總結，搬磚工逆襲Java架構師（全網最強）

摘要：哪吒社區技能樹打卡打卡貼函數式接口簡介領域優質創作者哪吒公眾號作者架構師奮斗者掃描主頁左側二維碼，加入群聊，一起學習一起進步歡迎點贊收藏留言前情提要無意間聽到領導們的談話，現在公司的現狀是碼農太多，但能獨立帶隊的人太少，簡而言之，不缺干 ? 哪吒社區Java技能樹打卡?【打卡貼 day2...

Scorpion 2021-11-18 10:02 評論0 收藏0
JS總結篇--[總結]JS操作DOM常用API詳解

摘要：文本整理了操作的一些常用的，根據其作用整理成為創建，修改，查詢等多種類型的，主要用于復習基礎知識，加深對原生的認識。方法主要是用于添加大量節點到文檔中時會使用到。文本整理了javascript操作DOM的一些常用的api，根據其作用整理成為創建，修改，查詢等多種類型的api，主要用于復習基礎知識，加深對原生js的認識。基本概念在講解操作DOM的api之前，首先我們來復習一下一些基...

malakashi 2019-08-20 16:52 評論0 收藏0
【連載】前端個人文章整理-從基礎到入門

摘要：個人前端文章整理從最開始萌生寫文章的想法，到著手開始寫，再到現在已經一年的時間了，由于工作比較忙，更新緩慢，后面還是會繼更新，現將已經寫好的文章整理一個目錄，方便更多的小伙伴去學習。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 個人前端文章整理從最開始萌生寫文章的想法，到著手...

madthumb 2019-08-23 14:15 評論0 收藏0