亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

HTML基本標(biāo)簽及結(jié)構(gòu)詳解

  發(fā)布時(shí)間：2020-11-23 17:05:21   作者：bat丶浪客   我要評(píng)論
這篇文章主要介紹了HTML基本標(biāo)簽及結(jié)構(gòu)詳解,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下

1.HTML概述

1.HTML：超文本標(biāo)記語(yǔ)言。是一種標(biāo)識(shí)性語(yǔ)言，非編程語(yǔ)言，不能使用邏輯運(yùn)算。通過標(biāo)簽將網(wǎng)絡(luò)上的文檔格式進(jìn)行統(tǒng)一，使分散的網(wǎng)絡(luò)資源鏈接為一個(gè)邏輯整體。

超文本是一種組織信息的方式，通過超級(jí)鏈接將多種媒介鏈接起來

標(biāo)記:標(biāo)簽。用<>包裹的具有一定含義的內(nèi)容，比如:…

靜態(tài)網(wǎng)頁(yè):不變

動(dòng)態(tài)網(wǎng)頁(yè)：跟后臺(tái)同時(shí)改變

2.HTML標(biāo)簽結(jié)構(gòu)

1.文檔結(jié)構(gòu)：

<!doctype html><!--!表示聲明的意思。這一行代碼意思：下面的文檔標(biāo)簽將以html5進(jìn)行解析-->
<html>
<!-頭部.用來完成一個(gè)網(wǎng)頁(yè)的相關(guān)設(shè)置->
<head>
    <meta charset="utf-8"><!--漢字編碼--><!--meta:元，用來完成對(duì)應(yīng)設(shè)置-->
    <meta name="keywords" content=""><!--設(shè)置一個(gè)網(wǎng)站搜索的關(guān)鍵字-->
    <meta name="description" content=""><!--網(wǎng)站的描述內(nèi)容-->
    <title>我的第一個(gè)html網(wǎng)頁(yè)</title><!--標(biāo)題-->
    <!--設(shè)置網(wǎng)站的小圖標(biāo)-->
    <link rel="shortcut icon" href="" type="image/png">
    <style>
        /*書寫樣式的地方*/
    </style>
    <link rel="stylesheet" href="style.css"><!--用來引入外部樣式文件-->
</head>
<!--2.主體部分-->
<body>
    <p>這是一個(gè)段落</p>
</body>
<script>
    //放腳本代碼的地方
</script>
</html>

2.常用標(biāo)簽：

<!--做移動(dòng)端開發(fā)設(shè)置-->
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
     <!--1.div標(biāo)簽，用于布局，沒有具體含義,分層。層-->
     <div></div>
     <!--2.hx:標(biāo)題,從1級(jí)到6級(jí)，1級(jí)最大，6級(jí)最小，自動(dòng)加粗，有默認(rèn)字號(hào)-->
     <h1></h1>...<h6></h6>
     <!--3.p標(biāo)簽：表示段落。相當(dāng)與一個(gè)回車.-->
     <p></p>
     <!--4.br：生成換行符-->
     <br>
     <!--6.a標(biāo)簽,實(shí)現(xiàn)鏈接跳轉(zhuǎn),target：_blank新窗口/_self當(dāng)前窗口_parent/top-->
     <a href="url地址/鏈接" title="B站">文本</a>
     <a href="url地址" target="_blank">文本</a>
     <a href="url地址" target="_self">文本</a>
     <a href="'#href" target="#href">文本</a>
     錨點(diǎn)鏈接 href='#href' 目標(biāo)位置的屬性要設(shè)置為與其一直 id='#href'
     <!--7.img用于加載外部圖片圖像，src用來設(shè)計(jì)加載的圖片或圖像的路徑,alt當(dāng)圖片圖像加載不成功時(shí)，顯示alt中的內(nèi)容，否則不會(huì)顯示-->
     src路徑 alt替換文本 title 圖片提示文本 width:圖像寬度 height:圖像高度 border邊框
     <img src="" alt="顯示不出的名字">
     <!--8.span作用與div一樣，都是用于布局，div會(huì)單獨(dú)占一行，span不會(huì),span便簽用于行內(nèi)布局-->
     <span></span>
     <!--9.ul和ol,前者無序后者有序，都用的li標(biāo)簽。-->
     <ul>
        <li>li1</li>
        <li>li2</li>
        <li>li3</li>
    </ul>
    <ol>
        <li>li1</li>
        <li>li2</li>
        <li>li3</li>
    </ol>
     //自定義列表 重點(diǎn)每個(gè)網(wǎng)站的最下面基本都是通過自定義
    <dl> dl中只能有dt和dd 一個(gè)dt對(duì)應(yīng)多個(gè)dd 為兄弟關(guān)系
        <dt></dt>名詞1
        <dd></dd>名詞1解釋1
        <dd></dd>名詞1解釋2
    </dl>自定義列表

4.標(biāo)簽屬性:

<!--標(biāo)簽屬性:
            1.通常由屬性名="屬性值"組成
            2.起附加信息的作用。
            3.不是所有標(biāo)簽都有屬性，比如br標(biāo)簽-->
            下面的title class就是屬性名，而后面的就是屬性值
    <p title="段落" class="content" id="content">這是一個(gè)測(cè)試段落</p>

5.部分其他標(biāo)簽:

<!--文本格式化標(biāo)簽：就是通過標(biāo)簽來美化文本外觀->
   <!--1.b和strong:都有加粗作用，且都是行級(jí)標(biāo)簽(不會(huì)自動(dòng)換行)，
   但strong還有強(qiáng)調(diào)作用。注:強(qiáng)調(diào)主要是用于SEO時(shí)，便于提前關(guān)鍵字-->
   <b>加粗</b>
   <strong>加粗且強(qiáng)調(diào)</strong>
   <!--2 i和em：使文字傾斜,em具有強(qiáng)調(diào)作用。且都是行級(jí)標(biāo)簽(不會(huì)自動(dòng)換行)，
   如果只是簡(jiǎn)單傾斜效果，用i標(biāo)簽就可以了，比如添加圖標(biāo)等-->
   <i>傾斜</i>
   <em>傾斜且強(qiáng)調(diào)</em>
   <!--3.pre預(yù)格式化文本,保留換行和空格及寬度。
   文字的字號(hào)會(huì)小一號(hào),塊級(jí)標(biāo)簽（在瀏覽器中會(huì)獨(dú)占一行）-->
   <pre>
       pre預(yù)格式化
       文本,保留換行和空
       格及寬度
   </pre>
   
   <!--samll和big，將文字縮小或放大一號(hào)（行級(jí)標(biāo)簽，不會(huì)獨(dú)占一行，且不識(shí)別寬高）-->
   <!--瀏覽器支持的最小字號(hào)是12px，顯示比12px還小的文字的話，需要進(jìn)行處理-->
   <p>我是正常的</p>
   <small>我是小一號(hào)的文字</small>
   
   <!--sub和sup：設(shè)置文本為下標(biāo)和上標(biāo),用來調(diào)整文本正常顯示的基線，且文字會(huì)自動(dòng)小一號(hào)-->
   <p>正常顯示:X1+X2=Y</p>
   <p>下標(biāo):X<sub>1</sub>+X<sub>2</sub>=Y</p>
   <p>下標(biāo):X<sup>1</sup>+X<sup>2</sup>=Y</p>
   
   刪除線 <del></del> <s></s>
   下劃線 <ins></ins> <u></u>
   轉(zhuǎn)義字符：&nbsp; 空格 &lt; 小于號(hào)  &gt;大于號(hào)

6.表格標(biāo)簽以及表單標(biāo)簽

表格標(biāo)簽結(jié)構(gòu): 作用:顯示 展示數(shù)據(jù)
    <table> <!--表格標(biāo)簽-->
        <th></th> 表頭單元格
        <tr>
            <td></td>單元格
        </tr>行
    </table>
    屬性
    align left center right 對(duì)齊
    border邊框 cellpadding 文字和單元格的距離 cellspacing 單元之間的距離 width
     表格結(jié)構(gòu)標(biāo)簽
    <thead></thead> 表頭區(qū)域
    <tbody></tbody> 主體區(qū)域
    
    合并單元格:跨行合并:rowspan行和行 跨列合并:colspan列和列
    合并代碼:跨行:在最上側(cè)單元格為目標(biāo)單元格，寫合并代碼
    跨列:在最左側(cè)單元格為目標(biāo)單元格，寫合并代碼
    跨行或跨列步驟:
    	1.確定跨行還是跨列 2.找到目標(biāo)單元格 3.刪除多余單元格

7.表單標(biāo)簽:

表單標(biāo)簽:主要用途:收集用戶信息
    表單由表單域 表單控件（元素） 提示信息組成
    表單域 實(shí)現(xiàn)用戶信息傳遞<form action="" method=""></form>
    action跟著的為地址 method提交方式 name名稱
    
    input輸入表單元素:
     <input type="text">
	   type屬性值:text文本 password密碼 button ridio單選框() checkbox(多選按鈕).....
	   	 submit(提交按鈕，將表單值提交給服務(wù)器) reset 清除表單的所有數(shù)據(jù)
	   	 button 普通按鈕 結(jié)合js使用 file 上傳文件
	   	 
	   name屬性:表單元素的名字，單選按鈕必須有相同的名字才可以多選1 
	    			單選按鈕和復(fù)選框都要有相同的name
	   value屬性 定義值
	    	每個(gè)元素都應(yīng)該有的，主要給后臺(tái)人員來使用的
	
		checked 針對(duì)單選和多選 當(dāng)頁(yè)面打開的時(shí)候默認(rèn)選擇
	
		maxlength 最大長(zhǎng)度

	select下拉表單元素
    使用場(chǎng)景:有多個(gè)選項(xiàng)，想節(jié)約空間<select name="" id="">
							    	<option value=""></option>
							   	 </select> 
    select至少包含一個(gè)option 在option中的屬性selected = selected進(jìn)行默認(rèn)選擇

	<label for=""></label>使用場(chǎng)景 for 和表單元素的id屬性相同就對(duì)應(yīng)上
	textarea文本域表單元素 輸入文本較多時(shí)
	<textarea><textarea>一般規(guī)定長(zhǎng)度通過css

到此這篇關(guān)于HTML基本標(biāo)簽及結(jié)構(gòu)詳解的文章就介紹到這了,更多相關(guān)HTML基本標(biāo)簽及結(jié)構(gòu)內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持腳本之家！

相關(guān)文章

最新評(píng)論