當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

html标签整理

發布時間：2024/1/8 编程问答 27 豆豆

生活随笔收集整理的這篇文章主要介紹了 html标签整理小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

HTML指的是超文本標記語言，它是用來描述網頁的一種語言，不是一種編程語言，標記語言是一套標記標簽。所謂超文本，兩層含義：一是可以加入圖片聲音動畫多媒體等內容（超越文本限制）；二是可以從一個文件跳到另一個文件，與世界各地主機的文件連接（超越鏈接文本）。

一、基本結構標簽

<html></html>根標簽
<head></head>文檔頭部
<title></title>網頁標題
<body></body>主體內容

<!DOCTYPE html>  <html lang="en"> <head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title> </head><body> </body> </html>

二、html基本標簽

（1）<h1>-<6>標題標簽：

（2）?<p></p>段落標簽，<br/>換行標簽：

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. <br> porro harum illum nihil hic optio nobis dolorem pariatur, <br>doloremque nesciunt saepe impedit id fuga soluta ratione itaque accusamus necessitatibus incidunt?</p>

（3）<hgroup></hgroup>組標題標簽?

<hgroup><h1>歡迎來到學習html標簽</h1><h2>歡迎學習前端</h2></hgroup>

（4）<hr>html線

<hr/>

（5）<div></div>和<span></span>結構里面放內容

<div class="test"><p>This is a test.</p><span>This is another test.</span></div>

三、文本格式化標簽

<strong></strong>或者<b></b>(輕)加粗
<em></em>或<i></i>（輕）傾斜
<del></del>或<s></s>(輕）刪除線
<ins></ins>或<u></u>(輕)下劃線

四、圖像標簽

<img src="圖像URL"/>（src圖片路徑，必須屬性）
alt,替換文本文本，圖像不能顯示文字
title，提示文本，鼠標經過提示
wight,給圖像設定寬度
height，給圖像設定高度

五、超鏈接標簽

鏈接語法格式<a href="跳轉目標"target="目標窗口彈出方式”>文本或圖案</a>

外部鏈接：<a href="http://www.baidu.com">百度</a>
內部鏈接：<a href="index.html">首頁</a>
空鏈接：<a href="#">家庭地址</a>
下載鏈接：<a href="022.zip">下載文件</a>
錨點鏈接：快速定位到頁面中某個位置，在href中設置屬性值”#名字“的形式（<a href="#name">名字來源</a>），在目標位置添加id屬性(<h3 id=“name">名字來源</h3>

六、注釋標簽和特殊字符

<！--注釋文字-->

七、表格標簽

<table></table>(用于定義表格標簽)
<tr></tr>(用于定義表格中的行)，必須嵌套在<table></table>標簽中
<td></td>(用于定義表格中的單元格)必須嵌套在<tr></tr>標簽中
<th></th>(表示表格的表頭部分,第一行文字加粗居中)

八、列表標簽

無序列表：<ul></ul>(里面只能放<li>標簽），<li></li>（可以放任何標簽），自帶樣式屬性（小圓黑點）
有序列表：<ol></ol>(里面只能放<li>標簽)，<li></li>(可以放任何標簽)，自帶樣式屬性（1、2、3）
自定義列表：<dl></dl>(只能包含<dt>和<dd>)，<dt></dt>(經常一個dt對應多個dd)，<dd></dd>(和dt是一起使用，并列關系，解釋dt)

九、表單標簽

<form action="" method="" name=""><input type="text"><br><input type="button" value="點擊按鈕"><br><input type="checkbox" value="">復選框1<br><input type="checkbox" value="">復選框2<br><input type="checkbox" value="">復選框3<br><input type="file" name="" id=""><br><input type="hidden" name=""><br><input type="image" src="./images/aaa.JPG" alt=""><br><input type="password" name="" id=""><br><input type="radio" name="haha" id="">單選框1<br><input type="radio" name="haha" id="">單選框2<br><input type="reset" value="重置按鈕"><br><input type="submit" value="提交按鈕"><br><select name="" id=""><option value="">北京</option><option value="">上海</option><option value="">深圳</option></select><br><textarea name="" id="" cols="30" rows="10"></textarea><br><label for="sex">男</lable><input type="radio" name="sex" id="sex"></form>

十、HTML5新增標簽

（1）語義化標簽

（2）多媒體標簽

視頻<video>:

autoplay:autoplay;(視頻就緒自動播放（谷歌瀏覽器需要添加muted來解決自動播放問題）)
control：control；（向用戶顯示播放控件）
width，height；（設置播放器寬度高度）
loop：loop；（播放完是否繼續播放該視頻，循環播放）
preload：auto（預先加載視頻）；preload：none（不應加載視頻）；（規定了是否預加載視頻（如果有了autoplay，就忽略該屬性））
src:url；視頻ur地址
poster:imgurl;(加載等待的畫面圖片)
muted：muted；（靜音播放）

音頻<audio>：

autoplay:autoplay;(如果出現該屬性，則音頻在就緒后馬上播放)
controls:controls;(如果出現該屬性，則向用戶顯示控件，比如播放按鈕)
loop：loop；（如果出現該屬性，則每當音頻結束時重新開始播放）
src:url;(要播放的音頻的URL)

表單<input>:

type="email"(限制用戶輸入必須為Email類型)
type="url"(限制用戶輸入必須為url類型)
type="date"(限制用戶輸入必須為日期類型)
type="time"(限制用戶輸入必須為時間類型)
type="month"(限制用戶輸入必須為月類型)
type="week"(限制用戶輸入必須為周類型)
type="number"(限制用戶輸入必須為數字類型)
type="tel"(手機號碼)
type="search"(搜索框)
type="color"(生成一個顏色選擇表單)

萬事得成于忍，與其能辯，不如能忍。

總結

以上是生活随笔為你收集整理的html标签整理的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

标签
html

上一篇： CSS新招式，临时记一下
下一篇：《JAVA语言程序设计》期末考试试题及答