html的標簽的介紹和使用

這篇文章主要為大家詳細介紹了html的標簽的介紹和使用，配合代碼閱讀理解效果更佳，非常適合初學者入門，感興趣的小伙伴們可以參考一下。

創(chuàng)新互聯(lián)公司是一家專業(yè)提供河源企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站制作、成都做網(wǎng)站、H5場景定制、小程序制作等業(yè)務(wù)。10年已為河源眾多企業(yè)、政府機構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站制作公司優(yōu)惠進行中。

html標簽

第一個html標簽

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>西部開源中心</title>
</head>
<body>
    <h2 >標題 </h2 >
    <h3 >標題 </h3 >
    <h4 >標題 </h4 >
    <h5 >標題 </h5 >
    <h6 >標題 </h6 >
    <h7 >標題 </h7 >
    <!沒有h7>
    <h7 >標題 </h7 >
</body>
</html>

文本標簽

html的標簽的介紹和使用

常用的文本標簽

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<i>斜體</i><br/>
<em>斜體</em><br/><hr>
<b>加粗字體</b>
<strong>加粗字體</strong>
<cite>引用</cite>
x<sub>1</sub> = pi*r<sup>2</sup>
原價：<del>￥100</del>
現(xiàn)價：<b >￥10</b>
<br/>

<p>這種東西只有在并發(fā)不高的項目，管理系統(tǒng)中用。

<p>如果是面向用戶的高并發(fā)應(yīng)用，都不要使用。

觸發(fā)器和存儲過程本身難以開發(fā)和維護，不能高效移植。

觸發(fā)器完全可以用事務(wù)替代。
存儲過程可以用后端腳本替代。

</body>
</html>

換行標簽

html的標簽的介紹和使用

文本標簽

html的標簽的介紹和使用

列表標簽

html的標簽的介紹和使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h2>無序列表：四大名著</h2>
<ul>
    <li>西游記</li>
    <li>三國演義</li>
    <li>水滸傳</li>
    <li>紅樓夢</li>
</ul>
<h2>有序標簽：四大名著</h2>
<ol type="a">
    <li>西游記</li>
    <li>三國演義</li>
    <li>水滸傳</li>
    <li>紅樓夢</li>
</ol>

<h2>自定義列表：</h2>
<dl>
    <dt>四大名著</dt>
    <dd>西游記</dd>
    <dd>三國演藝</dd>
    <dd>水滸傳</dd>
    <dd>紅樓夢</dd>
    <dt>前端開發(fā)</dt>
    <dd>html</dd>
    <dd>css</dd>
    <dd>js</dd>
</dl>
</body>
</html>

div與span標簽

html的標簽的介紹和使用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<! 塊級元素：一個元素占一整行>
<div >
    div 標簽
</div>

<! 行內(nèi)元素，一個元素站得位置取決標簽內(nèi)容>
<div >
<span>
    span 標簽
</span>

</body>
</html>

圖片標簽img

<img> 標簽定義 HTML 頁面中的圖像。有兩個必需的屬性:src 和 alt。
title:文字提示屬性
屬性:src: 圖片名及url地址
alt: 圖片加載失敗時的提示信息
width/height: 圖片寬度/高度
<a href=" ">...</a> 超級鏈接標簽
屬性:
href: 必須,指的是鏈接跳轉(zhuǎn)地址;
target: 表示鏈接的打開方式。
_blank 新窗口 ,
_self 本窗口(默認)
title:文字提示屬性

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<! src:指定的時間圖片的位置，可以通過絕對路徑和相對路徑表示，但大多數(shù)情況使用相對路徑
   alt：當圖片不能被加載出來時，顯示的文字信息 >
<img src="./img/baidu.gif" alt="百度圖片" width="500px"height="500px">

</body>
</html>

超鏈接標簽

錨點鏈接:

定義一個錨點:
<a id="a1"></a> 百度一下 <a name="a1"></a>
使用錨點:
<a href="#a1">跳到a1處</a>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h2>文字標簽</h2>
<a href="http://www.baidu.com">百度一下</a><br>
<a href="http://www.baidu.com" target="_blank" title="text"> 百度一下</a>

<h2>圖片搜索</h2><br/>
<hr>
<a href="http://www/baidu.com">
    <img src="baidu.gif" alt="baidu" title="baidu">
</a>

</body>
</html>

錨點的實現(xiàn)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<h2>錨點</h2>
<a href="#a1">跳到a處</a>
<a href="#a2">跳到a2處</a>

<h3 id="a1">標題一</h3>
<p>
一、存儲過程優(yōu)點

存儲過程是一組預(yù)先創(chuàng)建并用指定的名稱存儲在數(shù)據(jù)庫服務(wù)器上的 SQL 語句，將使用比較頻繁或者比較復(fù)雜的操作，預(yù)先用 SQL 語句寫好并存儲起來，以后當需要數(shù)據(jù)庫提供相同的服務(wù)時，只需再次執(zhí)行該存儲過程。

1.具有更好的性能

存儲過程是預(yù)編譯的，只在創(chuàng)建時進行編譯，以后每次執(zhí)行存儲過程都不需再重新編譯，而一般 SQL 語句每執(zhí)行一次就編譯一次，因此使用存儲過程可以提高數(shù)據(jù)庫執(zhí)行速度。

2.功能實現(xiàn)更加靈活

存儲過程中可以應(yīng)用條件判斷和游標等語句，有很強的靈活性，可以直接調(diào)用數(shù)據(jù)庫的一些內(nèi)置函數(shù)，完成復(fù)雜的判斷和較復(fù)雜的運算。

3.減少網(wǎng)絡(luò)傳輸

復(fù)雜的業(yè)務(wù)邏輯需要多條 SQL 語句，當客戶機和服務(wù)器之間的操作很多時，將產(chǎn)生大量的網(wǎng)絡(luò)傳輸。如果將這些操作放在一個存儲過程中，那么客戶機和服務(wù)器之間的網(wǎng)絡(luò)傳輸就會減少，降低了網(wǎng)絡(luò)負載。



<h3 id="a2">標題二</h3>
<p>
一、存儲過程優(yōu)點

存儲過程是一組預(yù)先創(chuàng)建并用指定的名稱存儲在數(shù)據(jù)庫服務(wù)器上的 SQL 語句，將使用比較頻繁或者比較復(fù)雜的操作，預(yù)先用 SQL 語句寫好并存儲起來，以后當需要數(shù)據(jù)庫提供相同的服務(wù)時，只需再次執(zhí)行該存儲過程。

1.具有更好的性能

存儲過程是預(yù)編譯的，只在創(chuàng)建時進行編譯，以后每次執(zhí)行存儲過程都不需再重新編譯，而一般 SQL 語句每執(zhí)行一次就編譯一次，因此使用存儲過程可以提高數(shù)據(jù)庫執(zhí)行速度。

2.功能實現(xiàn)更加靈活
</p>

</body>
</html>

表格標簽

html的標簽的介紹和使用

標簽:
?表格標簽:table
?行標簽:tr
?單元格(表示列的概念):td
?表頭:th :加粗并且居中
?表格標題:caption
html的標簽的介紹和使用
?標簽合并:
行合并:rowspan
列合并:colspan
?標簽常用屬性:
border:邊框
width:寬度
height:高度
algin:對齊方式
center,left,right

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<table border="1px"align="center" width="500px" >
    <caption>表格標題</caption>
    <tr>
        <td>1-1</td>
        <td>1-2</td>
        <td>1-3</td>
    </tr>
    <tr>
        <td>1-1</td>
        <td>1-2</td>
        <td>1-3</td>
    </tr>
    <tr>
        <td>1-1</td>
        <td>1-2</td>
        <td>1-3</td>
    </tr>

</table>

</body>
</html>

from表格標簽

常用屬性:
? action屬性:提交的目標地址(URL)
? method屬性:提交方式:get(默認)和post
get方式:
URL地址欄可見
長度受限制
相對不安全.
post方式:
URL地址不可見
長度不受限制
相對安全.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<hr/>
<form action="sucess.html" method="get">

    <!--創(chuàng)建三行兩列的表格-->
    <table width="20%" align="center" >
        <tr>
            <td colspan="2" ><h4>用戶登錄</h4></td>
        </tr>
        <tr>
            <td >用戶名</td>
            <td><input type="text"></td>
        </tr>
        <tr>
            <td >密碼</td>
            <td><input type="password"></td>
        </tr>
        <tr>
            <td colspan="2" > <input type="submit" value="登錄"></td>
        </tr>
    </table>

</form>

</body>
</html>

表單項標簽

<input> 表單項標簽input定義輸入字段,用戶可在其中輸入數(shù)據(jù)。
在 HTML 5 中,type 屬性有很多新的值。
html的標簽的介紹和使用

下拉列表標簽

<select>...</select> 標簽創(chuàng)建下拉列表。
? name屬性:定義名稱,用于存儲下拉值的
? size:定義菜單中可見項目的數(shù)目,html5不支持
? disabled 當該屬性為 true 時,會禁用該菜單。
? multiple 多選
<option>... </option> 下拉選擇項標簽,用于嵌入到<select>標簽中使用的;
? value屬性:下拉項的值
? selected屬性:默認下拉指定項.

文本域標簽

<textarea>...</textarea> 多行的文本輸入?yún)^(qū)域
? name :定義名稱,用于存儲文本區(qū)域中的值。
? cols :規(guī)定文本區(qū)內(nèi)可見的列數(shù)。
? rows :規(guī)定文本區(qū)內(nèi)可見的行數(shù)。
? disabled: 是否禁用
? readonly: 只讀

按鈕標簽

<button>...</button> 標簽定義按鈕。
<fieldset> --fieldset 元素可將表單內(nèi)的相關(guān)元素分組。
html的標簽的介紹和使用

html內(nèi)嵌框架

內(nèi)嵌框架與a標簽配合使用

a標簽的target屬性可以將鏈接到的頁面直接顯示在當前頁面的iframe中,代碼如下:
html的標簽的介紹和使用

關(guān)于html的標簽就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學到更多知識。如果喜歡這篇文章，不如把它分享出去讓更多的人看到。

本文標題：html的標簽的介紹和使用
當前網(wǎng)址：http://jinyejixie.com/article16/igoogg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供動態(tài)網(wǎng)站、網(wǎng)站維護、網(wǎng)站制作、移動網(wǎng)站建設(shè)、企業(yè)建站、關(guān)鍵詞優(yōu)化

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

成人午夜视频全免费观看高清-秋霞福利视频一区二区三区-国产精品久久久久电影小说-亚洲不卡区三一区三区一区

html的標簽的介紹和使用

html標簽

第一個html標簽

文本標簽

常用的文本標簽

換行標簽

文本標簽

列表標簽

div與span標簽

圖片標簽img

超鏈接標簽

錨點的實現(xiàn)

表格標簽

from表格標簽

表單項標簽

下拉列表標簽

文本域標簽

按鈕標簽

html內(nèi)嵌框架

內(nèi)嵌框架與a標簽配合使用