Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
例
文檔的某個區域,解釋了什么是 WWF :
<section>
<h1>WWF</h1>
<p>The World Wide Fund for Nature (WWF) is....</p>
</section>
瀏覽器支持
IE 9+、Firefox、Opera、Chrome 和 Safari <section> 標簽。
注釋:IE 8 或更早版本的 IE 瀏覽器不支持 <section> 標簽。
標簽定義及使用說明
<section> 標簽定義了文檔的某個區域。比如章節、頭部、底部或者文檔的其他區域。
HTML 4.01 與 HTML5之間的差異
<section> 標簽是 HTML5 中的新標簽。
全局屬性
<section> 標簽支持 HTML 的全局屬性。
事件屬性
<section> 標簽支持 HTML 的事件屬性。
如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039,我們一起飛!
TML是一種用來描述網頁的標記性語言。學習HTML可能并不難,主要是要記一些HTML標簽和標簽代表的含義。下面PHP程序員雷雪松根據使用的情況,整理出平時常用的HTML標簽。
HTML基礎之HTML常用標簽-PHP程序員雷雪松的博客
<!--<!DOCTYPE> 是HTML5聲明,<!DOCTYPE> 必須是 HTML 文檔的第一行,位于 <html> 標簽之前。<!DOCTYPE>是指示 web 瀏覽器關于頁面使用哪個 HTML 版本進行編寫的指令。-->
<!DOCTYPE html>
<html>
<!-- head標簽是所有頭部元素的容器。head標簽內的元素可包含腳本、樣式表和提供頁面的元信息等等。以下標簽都可以添加到 head 部分:title、base、link、meta、script 以及style。頭部的內容不會顯示在瀏覽器的。 -->
<head>
<!-- 設置字符集,如果字符集不對,可能導致亂碼。一般建議utf-8國際編碼 -->
<meta http-equiv="Content-Type" content="text/html; charset=gb2312或utf-8或gbk" />
<!-- SEO相關標簽,title定義文檔的標題,百度建議一般不要超過32位,meta定義頁面關鍵詞和頁面的描述-->
<title>網頁標題</title>
<meta name="keywords" content="PHP程序員,技術博客,個人博客,雷雪松" />
<meta name="description" content="PHP程序員,雷雪松(Raykaeso)的博客是一個優秀的個人技術博客。PHP程序員雷雪松的博客記錄了Linux學習,PHP開發與編程,Web前端開發,MySQL學習和教程,NoSQL數據庫教程以及個人的人生經歷和觀點。" />
<link rel="stylesheet" type="text/css" href="main.css" />
<script type="text/javascript" src="main.js"></script>
</head>
<!-- 正文部分,所有在瀏覽器上可見的內容必須寫在body標簽內部 -->
<body>
</body>
</html>
a、布局標簽
div標簽定義文檔中的分區或節(division/section),可以把文檔分割為獨立的、不同的部分,主要用于布局。
aside標簽的內容可用作文章的側欄,<span style="color: #ff0000;">html5新增標簽</span>。
header標簽定義頁面的頭部(介紹信息),<span style="color: #ff0000;">html5新增標簽</span>。
section標簽定義文檔中的節(section、區段)。比如章節、頁眉、頁腳或文檔中的其他部分,<span style="color: #ff0000;">html5新增標簽</span>。
footer 標簽定義文檔或節的頁腳,通常包含文檔的作者、版權信息、使用條款鏈接、聯系信息等等,<span style="color: #ff0000;">html5新增標簽</span>。
article標簽規定文章獨立的其他內容,比如:標題、內容、評論,<span style="color: #ff0000;">html5新增標簽</span>。
b、文本標簽
h1-h6標簽可定義標題
p標簽定義段落
b/strong標簽加粗
em標簽來表示強調的文本,斜體
strong標簽表示重要文本
u標簽下劃線
s標簽刪除線
br標簽表示回車換行
hr標簽表示水平線
span標簽被用來組合文檔中的行內元素。
blockquote標簽表示塊引用
pre標簽可定義預格式化的文本,保持原有格式的一種標簽。
sub標簽下標,
sup>標簽上標
表示一個空格
©表示版權符
<表示<
>表示>
c、a標簽定義超鏈接,指定頁面間的跳轉。鏈接可以指向外部鏈接或者頁面內部id錨點,可以在當前頁面打開,新開窗口。
<a href="指向的鏈接地址或者網址#ID名" target="_blank|_self|_top|_parent">百度</a>
d、多媒體標簽
img標簽主要在網頁中插入圖像,可以定義圖片替換文本、顯示寬度和高度、是否帶邊框,建議等比例設置,否則圖像會變形。
<img src="圖片地址" alt="替換文本,圖片打不開的時候顯示" width="圖片寬度" height="高度" border="0" />
audio標簽定義聲音,比如音樂或其他音頻流。<span style="color: #ff0000;">html5新增標簽</span>。
<audio src="someaudio.wav">您的瀏覽器不支持 audio 標簽。</audio>
video標簽定義視頻,比如電影片段或其他視頻流。<span style="color: #ff0000;">html5新增標簽</span>。
<video src="movie.ogg" controls="controls">您的瀏覽器不支持 video 標簽。</video>
e、序列化標簽
ul和li無序列表標簽
<ul>
<li>HTML</li>
<li>JS</li>
<li>PHP</li>
</ul>
ol和li有序列表標簽,可以使用type屬性規定有序列表符號的類型。1 按數字有序排列,為默認值,(1、2、3、4);a 按小寫字母有序排列,(a、b、c、d);A 按字母大寫有序排列,(A、B、C、D)。i 按小寫羅馬字母有序,(i, ii, iii, iv);I 按小寫羅馬字母有序,(I, II, III, IV)。
<ol>
<li>HTML</li>
<li>JS</li>
<li>PHP</li>
</ol>
dl標簽定義了定義列表(definition list),dl標簽用于結合 dt(定義列表中的項目)和 dd(描述列表中的項目)。
<dl>
<dt>計算機</dt>
<dd>用來計算的儀器 ... ...</dd>
</dl>
f、表格標簽
table標簽和tr標簽,th標簽和td標簽,合并單元格。
<table width="100%" height="193" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF0000" bgcolor="#000000" background="">
<tr>
<th>標題</th>
<th>標題</th>
</tr>
<tr>
<!-- 合并橫向單元格 -->
<td colspan="2" nowrap="nowrap">&nbsp;</td>
</tr>
<tr>
<td></td>
<!-- 合并縱向單元格 -->
<td rowspan="2"> </td>
</tr>
<tr>
<td height="16"> </td>
</tr>
</table>
g、表單標簽
form標簽定義提交方式、提交地址、表單字符集以及如何對其進行編碼,需要提交的表單一定要放在form標簽內。
<form id="form1" name="form1" method="post|get" enctype="multipart/form-data" action="提交到的地址"></form>
input標簽用于搜集用戶信息
<input name="userName" type="text" maxlength="5" size="100" value="asdfasdfasfd" />
密碼,輸入的字符會被掩碼(顯示為星號或原點)
<input name="pwd" type="password" maxlength="5" size="100" value="" />
文件類型的表單,上傳文件時,form表單一定要設置為enctype="multipart/form-data"
<input type="file" name="file" />
隱藏表單
<input type="hidden" name="country" value="China" />
提交
<input type="submit" name="Submit" value="提交" disabled="disabled" />
重置
<input type="reset" name="Submit2" value="重置" />
radio單選
<input name="sex" type="radio" value="1" />男
<input name="sex" type="radio" value="2" checked="checked" />女
checkbox多選
<input name="skill" type="checkbox" value="1" checked="checked" />PHP
<input name="skill" type="checkbox" value="2" />前端
<input name="skill" type="checkbox" value="2" />數據庫
<span style="color: #ff0000;">注:checked="checked"可以簡寫成checked</span>
label標簽為input元素定義標注,如果您點擊label元素文本,就會觸發此input控件。
textarea標簽,設置文本區內的可見行數和寬度
<textarea name="content" cols="30" rows="10">大段文本輸入框</textarea>
button標簽定義一個按鈕
提交按鈕
<button type="submit" value="提交">提交</button>
重置按鈕
<button type="reset" value="重置">重置</button>
select標簽和option標簽下拉列表
單選菜單列表框
<select name="user">
<option value="1">ray</option>
<option value="2" selected="selected">raykaeso</option>
</select>
多選列表下拉框,shift加鼠標單擊,可以連續選擇多個選擇,CTRL+鼠標點擊,可以點擊多個。
<select name="user" size="10" multiple="multiple">
<option value="1">雷雪松</option>
<option value="2" selected="selected">ray</option>
<option value="3">raykaeso</option>
</select>
注:selected="selected"可簡寫成selected,表示選中
a、HTML標簽和屬性是不區分大小寫的,建議HTML標簽和屬性都小寫,屬性值必須用雙引號包圍。
b、HTML標簽都是以開始標簽起始,以結束標簽終止。大部分HTML標簽都是成對出現的,稱為雙標簽,比如:p標簽、div標簽,也有的HTML標簽在開始標簽中結束的標簽,稱為單標簽,比如:hr標簽、br標簽。大多數 HTML 元素可擁有屬性,文本內容都是寫在開始標簽與結束標簽之間。
c、HTML標簽之間盡量縮進與換行,每行代碼不要過長,方便閱讀和維護。
d、HTML標簽使用必須符合標簽嵌套規則。禁止a標簽嵌套a標簽,p標簽嵌套div標簽。
e、建議不使用HTML已經廢棄的或者不贊成使用的標簽,少使用table布局、iframe框架嵌套以及flash播放器。
來源:PHP程序員雷雪松的博客 -HTML基礎之HTML常用標簽(http://www.leixuesong.cn/2045)
TML(HyperText Markup Language)是一種用于創建網頁的標準標記語言。在HTML中,"元素"和"標簽"是構建網頁的基本組成部分,它們一起定義了網頁的結構和內容。HTML標簽是用來定義HTML元素的開始和結束的,而HTML元素是由標簽及其包含的內容組成的。
參考文檔:https://www.cjavapy.com/article/3303/
HTML元素指的是從開始標簽到結束標簽的所有內容。它們是HTML文檔的構建塊,用于創建和組織網頁內容。HTML元素可以包含文本、圖片、鏈接、表格等多種類型的數據。元素可能包括一個開始標簽和一個結束標簽,也可能只有一個標簽(在自閉合元素的情況下)。
1) <!DOCTYPE> 聲明
用于定義文檔類型,告訴瀏覽器此文檔使用哪個HTML版本。
<!DOCTYPE html>
2) <html>
根元素,包含整個HTML文檔。
<html lang="en">
</html>
3) <head>
包含文檔的元數據,如標題、字符集聲明和鏈接到樣式表。
<head>
<title>頁面標題</title>
<meta charset="UTF-8">
</head>
4)<title>
定義文檔的標題,顯示在瀏覽器的標題欄或頁面的標簽頁上。
<title>這是文檔的標題</title>
5)<body>
包含文檔的所有可見內容,如文本、圖片、鏈接和其他多媒體元素。
<body>
<h1>這是一個主標題</h1>
<p>這是一個段落。</p>
</body>
6) <header>
定義一個區域或頁面的頭部,通常包含標題和導航鏈接。
<header>
<h1>網站標題</h1>
<nav>
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">關于</a></li>
</ul>
</nav>
</header>
7) <footer>
定義頁面或區域的頁腳部分,通常包含版權信息、聯系信息等。
<footer>
<p>版權所有 ? 2024</p>
</footer>
8) <nav>
定義導航鏈接的部分,用于頁面內或頁面間的導航。
<nav>
<ul>
<li><a href="#">首頁</a></li>
<li><a href="#">新聞</a></li>
</ul>
</nav>
9)<section>
定義文檔中的一個獨立部分,通常與標題一起使用。
<section>
<h2>章節標題</h2>
<p>這是該章節的一些內容。</p>
</section>
10. <article>
定義可以獨立于內容其余部分的完整自包含內容,例如博客帖子或新聞文章。
<article>
<h2>文章標題</h2>
<p>文章內容...</p>
</article>
11. <aside>
定義與周圍內容稍微分離的內容,如側邊欄或廣告欄。
<aside>
<p>這是一些附加信息。</p>
</aside>
12. <figure> 和 <figcaption>
<figure> 定義獨立的流內容(如圖表、圖像、代碼示例等),<figcaption> 提供該內容的標題。
<figure>
<img src="image.jpg" alt="描述性文本">
<figcaption>圖像標題</figcaption>
</figure>
HTML標簽是HTML元素的一部分,用于從邏輯上開始或結束一個元素。標簽通常成對出現,包括一個開始標簽和一個對應的結束標簽,結束標簽的名稱前會有一個斜線(/)作為區分。有些HTML標簽是自閉合的,意味著它們不需要結束標簽,如圖像標簽(<img />)和換行標簽(<br />)。
標簽 | 說明 |
<!DOCTYPE> | 聲明文檔類型和HTML版本。 |
<html> | 標識一個HTML文檔的根元素。 |
<head> | 包含了文檔的元數據。 |
<title> | 指定文檔的標題。 |
<body> | 包含了可見的頁面內容。 |
<h1> - <h6> | 定義標題,從 <h1> 到 <h6> 重要性遞減。 |
<p> | 定義段落。 |
<br> | 插入一個換行符。 |
<hr> | 在頁面上繪制一條水平線。 |
<b> | 定義粗體文本。 |
<i> | 定義斜體文本。 |
<u> | 定義下劃線文本。 |
<strong> | 定義重要文本。 |
<em> | 定義強調文本。 |
<mark> | 定義被標記或高亮的文本。 |
<small> | 定義小號文本。 |
<sub> | 定義下標文本。 |
<sup> | 定義上標文本。 |
<a> | 定義超鏈接。 |
<img> | 在頁面中嵌入圖像。 |
<ul> | 定義無序列表。 |
<ol> | 定義有序列表。 |
<li> | 定義列表項。 |
<table> | 定義表格。 |
<th> | 定義表格的表頭單元格。 |
<tr> | 定義表格的行。 |
<td> | 定義表格單元。 |
<form> | 定義HTML表單。 |
<input> | 定義輸入控件。 |
<textarea> | 定義多行文本輸入控件。 |
<button> | 定義按鈕。 |
<select> | 定義下拉列表。 |
<option> | 定義下拉列表中的選項。 |
<article> | 定義文章。 |
<section> | 定義文檔中的一個區域(或節)。 |
<header> | 定義介紹性內容或導航鏈接的容器。 |
<footer> | 定義注腳或文檔的頁腳。 |
<nav> | 定義導航鏈接的部分。 |
<aside> | 定義側邊欄內容。 |
使用示例:
<!DOCTYPE html>
使用示例:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML標簽使用示例</title>
</head>
<body>
<header>
<h1>歡迎來到我的網頁</h1>
<nav>
<a href="#content">主要內容</a> |
<a href="#contact-form">聯系表單</a>
</nav>
</header>
<section id="content">
<article>
<h2>HTML基礎</h2>
<p>HTML是構建網頁的基石。<strong>標簽</strong>是它的核心組成部分。<mark>本文</mark>介紹了一些最常用的HTML標簽。</p>
</article>
<aside>
<h3>注意</h3>
<p>記得檢查HTML5的新特性和標簽。</p>
</aside>
<ul>
<li>文本標簽</li>
<li>列表</li>
<li>表格</li>
<li>表單</li>
</ul>
<ol>
<li>先介紹基礎</li>
<li>然后是進階</li>
</ol>
<table>
<tr>
<th>標簽</th>
<th>描述</th>
</tr>
<tr>
<td><p></td>
<td>段落標簽</td>
</tr>
<tr>
<td><a></td>
<td>鏈接標簽</td>
</tr>
</table>
</section>
<section id="images">
<h2>圖片</h2>
<img src="example.jpg" alt="示例圖片">
</section>
<footer>
<section id="contact-form">
<h2>聯系我們</h2>
<form>
<label for="name">姓名:</label>
<input type="text" id="name" name="name"><br>
<label for="email">電子郵件:</label>
<input type="email" id="email" name="email"><br>
<input type="submit" value="提交">
</form>
</section>
<p>? 2024 HTML標簽示例</p>
</footer>
</body>
</html>
參考文檔:Hhttps://www.cjavapy.com/article/3303/
*請認真填寫需求信息,我們會在24小時內與您取得聯系。