HTML

1、web標準

一.HTML介紹:1.概述:HTML全稱Hyper Txet Macepu Language,翻譯爲超文本標記語言,不是編程語言,是一種描述性的標記語言,用於描述超文本內容的顯示方式,好比字體,顏色,大小等.HTML    超文本:音頻,視頻,文件,稱爲超文本.    標記:<單詞或字母>這樣的格式稱爲標記,一個HTML頁面就是由各類標記組成的.沒有編譯的過程,HTML頁面直接由瀏覽器解析執行    HTML除了語義什麼都沒有2.HTML標籤對:標籤對可以給文本不一樣的語義3.HTML的網絡術語:    網頁,由各類標記組成的頁面就叫網頁    標記:<p>這樣的標記稱爲開始標記,</p>這樣的標記稱爲結束標記,也叫標籤,每一個標籤都規定好了,特殊的含義    元素:<p>內容</p>這樣的總體稱爲元素4.HTML規範    4.1編寫規範:        HTML不區分大小寫,可是儘可能用小寫        HTML頁面的後綴名是html或htm(因爲有一些系統不支持後綴名的長度超過3個字符)        HTML的結構:            聲明的部分:主要高告訴瀏覽器,咱們這個頁面使用的是哪一個標準,HTML標準            head部分:將不會顯示在頁面上的一些額外的信息告訴服務器            body部分:正常顯示在頁面上的內容放在此標籤內                <!--文檔的聲明,告訴咱們執行的是HTML標準-->                <!DOCTYPE html>                <html lang="en">                <head>                    <!--網站的配置-->                    <meta charset="UTF-8">                    <!--標題標籤-->                    <title>shanghongyun</title>                </head>                <body>                正常顯示在頁面上的內容放在此標籤內                </body>                </html>    4.2基本語法特徵:        HTML對換行不敏感,對tab不敏感        空白摺疊        嚴格封閉5.結構詳解:    1.頭標籤:    頭標籤放在頭部之間,包含了<title>,<meta>,<link>,<style>        <title>:整個網頁的標題,在瀏覽器最上方顯示            <title>中國鐵路</title>        <meta>:提供有關頁面的基本信息            (1)http-equiv屬性,與之對應的屬性值爲content                兩秒後跳到對應的網址                    <meta http-equiv="refresh" content="2;URL=http://www.luffycity.com">                     refresh是固定的                 2是兩秒   跳到這個網址                指定文檔的內容類型,編碼類型                    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />                                                            內容類型      編碼類型                告訴IE瀏覽器,以最高級模式渲染當前網頁                    <meta http-equiv="x-ua-compatible" content="IE=edge">            (2)name屬性,與之對應的屬性爲content,主要用於頁面的關鍵字和描述                便於搜索引擎查找和分類用的關鍵字(關鍵字之間用逗號隔開)                    <meta name="keywords" content="文字,圖片,視頻">                告訴搜索引擎,這個頁面是幹什麼的                    <meta name="Description" content="介紹一下網易是幹什麼的">        <link>:定義文檔與外部資源的關係        <style>:定義內容樣式表與頁面的關係    2.字體標籤        字體標籤包括:h1-h6,<font>,<u>,<b>,<strong><em>,<sup>,<sub>        h1-h6:定義標題的大小(h1-h6從大到小),具備align屬性,屬性值能夠是:center,left,right            <h1 align="center">火車票</h1>            <h2 align="left">火車票</h2>            <h3 align="right">火車票</h3>            <h4>火車票</h4>            <h5>火車票</h5>            <h6>火車票</h6>        <strong>:加粗            <strong>火車票</strong>        <u>:加下劃線            <u>火車票</u>        <i>:斜體            <i>火車票</i>        <em>:斜體            <em>火車票</em>        <sup>:上標        <sub>:下標            5<sup>2</sup>            4<sub>3</sub>        <br>:換行            火車票<br>zdfsdf        <del>:刪除線            <del>79</del>        <hr>:畫一條橫線    3.特殊字符:        &nbsp:空格        &lt:小於號        &gt:大於號        &copy:版權            火&nbsp車&lt票&gt&copy(直接連起來用就行)        更多特殊字符:http://tool.chinaz.com/Tools/HtmlChar.aspx    4.排版標籤:      HTML的標籤是分等級的,HTML將全部的標籤分爲兩級:      文本級標籤:p,span,a,b,i,u,em  文本標籤裏只能放文字圖片和表單元素      容器級標籤:div,h系列,li,dt,dd  容器級標籤裏能夠聽任何東西        段落標籤:<p>,有aligen屬性,屬性值包括:left,center,right            <p align="center">段落一</p>            <p>段落二</p>            ***p標籤是一個文本級標籤        塊級標籤:<div>,<span>            div的語義是分割,span的語義是範圍,跨度            <span>和<div>的區別:<span>是不換行的,<div>是換行的,div是用來劃分大的區域的,span是用來劃分小的區域的            <div>連用時,行與行之間沒有間隙,<p>連用時,行與行之間有間隔    5.超連接        <a> 具備herf,id,class,title屬性,  a是一個文本級標籤            <a href="http://www.baidu.com" id='ancher' class='foot',title='歡迎你'>百度一下</a>            這裏面的id是不能夠重複的,class是能夠重複的,title鼠標在上面懸浮時,過一段時間就會顯示的東西,title是每個標籤都具備的屬性    6.圖片標籤        <img>具備src,weight,height,title,align,alt屬性            <img src=".\18.jpg" alt="很差意思放出來" height="100">                src 是要打開的圖片,已用絕對路徑,也能夠用相對路徑,也能夠用網上的路徑                alt 是圖片顯示不出來時,顯示出來的文字                height 是圖片的高度,也有寬度weight屬性,同時使用時要注意比例,不要失真,單個使用時,自動調整比例,寬和高的單位都是px            html中:        分類:            (1).行內標籤                (1)在一行內顯示  span  strong em i del a                 (2)不能設置寬高  默認的寬和高 是內容填充                1.1 行內塊標籤 img input                    (1) 在一行內顯示                    (2) 能夠設置寬高            (2).塊級標籤  div p h1~h6                (1)獨佔一行                (2)能夠設置寬高,若是不設置寬和高,默認的寬是父親的100%。高度是內容的高度    7.表單        <form>            <div>                <form action="http://www.baidu.com/s">                    <input type="text" name="wd" value="楊丞琳">                    <input type="submit" value="搜索">                </form>            </div>            <div>                <form action="http://www.baidu.com/s">                    <input type="text" name="wd" value="">                    <input type="password" name="pwd" value="">                    <input type="submit" value="搜索">                </form>            </div>
相關文章
相關標籤/搜索