整合營銷服務商

          電腦端+手機端+微信端=數(shù)據(jù)同步管理

          免費咨詢熱線:

          產(chǎn)品經(jīng)理的技術(shù)腦:html是什么意思?

          文本標記語言(HTML)是用于在 Internet 上顯示 Web 頁面的主要標記語言。換句話說,網(wǎng)頁由 HTML 組成,用于通過 Web 瀏覽器顯示文本,圖像或其他資源。

          使用標記來描述文檔結(jié)構(gòu)和表現(xiàn)形式并通過瀏覽器進行解析,然后把結(jié)果顯示在網(wǎng)頁上. 它是網(wǎng)頁構(gòu)成的基礎(chǔ),你見到的所有網(wǎng)頁都離不開HTML,所以學習HTML是基礎(chǔ)中的基礎(chǔ)。


          什么是HTML


          HTML是用來制作網(wǎng)頁的標記語言

          HTML是Hypertext MarkupLanguage的英文縮寫, 即超文本標記語言

          HTML語言是一種標記語言,不需要編譯,直接由瀏 HTML語言是一種標記語言,不需要編譯,直接由瀏覽器執(zhí)行

          HTML文件是一個文本文件,包含了一些HTML元素, HTML文件是一個文本文件,包含了一些HTML元素,標簽等.

          HTML文件必須使用html或htm為文件名后綴

          HTML是大小寫不敏感的,HTML與html是一樣的


          HtmlCSS的關(guān)系


          學習web前端開發(fā)基礎(chǔ)技術(shù)需要掌握:HTML、CSS、JavaScript語言。下面我們就來了解下這三門技術(shù)都是用來實現(xiàn)什么的:


          1. HTML是網(wǎng)頁內(nèi)容的載體。內(nèi)容就是網(wǎng)頁制作者放在頁面上想要讓用戶瀏覽的信息,可以包含文字、圖片、視頻等。

          2. CSS樣式是表現(xiàn)(外觀控制)。就像網(wǎng)頁的外衣。比如,標題字體、顏色變化,或為標題加入背景圖片、邊框等。所有這些用來改變內(nèi)容外觀的東西稱之為表現(xiàn)。

          3. JavaScript是用來實現(xiàn)網(wǎng)頁上的特效效果。如:鼠標滑過彈出下拉菜單。或鼠標滑過表格的背景顏色改變。還有焦點新聞(新聞圖片)的輪換??梢赃@么理解,有動畫的,有交互的一般都是用JavaScript來實現(xiàn)的。

          HTML形象案例理解


          為了簡化對復雜Internet的理解,暫時把復雜的Internet抽象成:向女生宿舍發(fā)送信號。

          為了能夠在斷網(wǎng)后繼續(xù)聯(lián)絡女神,我們買來了電池和開關(guān),然后拉了普通電線線到女神的寢室。女神把小燈泡接在了電線的兩端。

          這時只需要開閉開關(guān),就可以控制女神屋里的燈泡了。

          發(fā)送信號

          關(guān)閉著小燈泡1秒鐘,代表發(fā)送一個0。

          打開了小燈泡1秒鐘,代表發(fā)送一個1。

          此時可以向女神發(fā)送任意二進制內(nèi)容了。

          發(fā)送文本

          我們只希望發(fā)送一個“Good Night”。所以必須想辦法對“Good Night”進行編碼。

          'G','o','o','d'的ASCII編碼是:071,111,111,100,轉(zhuǎn)換成二進制就是:0100 0001 0110 1111 0110 1111 0110 0100

          使用發(fā)送二進制信號的方法發(fā)過去,女神需要自己解碼來閱讀出“Good”。


          發(fā)送富文本

          有一天,我們希望發(fā)送“I miss you”。

          為了表達心意,你希望加粗“you”,并使用紅色的字體發(fā)送“miss”,而這一根簡陋的電線似乎很難理解“加粗”和“紅色”

          于是機智的我們發(fā)送了:I <red>miss</red> <b>you</b>

          同樣機智的女神理解了這件事情。


          你發(fā)明了一種語言

          我們很喜歡這種編碼格式,這是一種標記語言,于是我們稱其為:TGML (To Girl Markup Language)

          平時你使用TGML來和你的女神通信,TGML可以非常好的解決富文本的傳輸問題。

          表白

          終于決定表白了,我們繪制了很美麗的心形圖片,還有兩個按鈕:接受、拒絕。

          兩個按鈕分別會鏈接到 "接受.tgml"和"拒絕.tgml"

          為了描述圖片,我們使用了<img src="pic">

          為了描述按鈕,我們使用了<a href="接受.tgml">

          現(xiàn)在發(fā)送給女神的內(nèi)容,已經(jīng)不只是帶格式的富文本,而是帶鏈接的富文本。

          于是在這個世界上,擁有了一種能夠描述超文本的語言,叫做TGML

          超文本

          描述超文本的方式有很多,例如:HTML,TGML,還有markdown。HTML的誕生是為了描述超文本。

          超文本的用途也很多,例如:描述一個網(wǎng)頁,或者描述一個Word文檔。HTML文件是超文本文件。但是超文本未必是HTML。

          Microsoft Word

          Microsoft Word是Office的一個組件。它同樣代表一個超文本資源。

          如果你解壓一個docx文件并仔細翻一翻,你能找到你剛才寫的作業(yè),是以HTML方式記載著。

          當然,描述超文本還有markdown。所以你可以使用一些工具,比如pandoc,把markdown轉(zhuǎn)換成word。


          故事的結(jié)局

          女神的名字叫瀏覽器,我們的名字叫Web服務器,女神和我們中間的那根線叫HTTP。

          eb標準:

          由于不同瀏覽器解析出來的網(wǎng)頁效果可能不同,所以需要通過web標準對其進行約束使其一致,主要包括三個方面:

          結(jié)構(gòu)標準:

          結(jié)構(gòu)用于對網(wǎng)頁元素進行整理和分類,主要指的是HTML。

          表現(xiàn)標準

          表現(xiàn)用于設置網(wǎng)頁元素的版式、顏色、大小等外觀樣式,主要指的是CSS。

          行為標準:

          行為是指網(wǎng)頁模型的定義及交互的編寫,主要指的是 JavaScript。

          初識HTML:

          html 全稱 Hyper Text Markup Language ,中文譯為:“超文本標記語言” ,描述網(wǎng)頁的一種語言。

          HTML發(fā)展:

          XHTML 是一個 W3C 標準,可擴展超文本標簽語言(EXtensible HyperText Markup Language),更嚴格更純凈的 HTML 版本,作為一種 XML 應用被重新定義的 HTML。



          HTML中的注釋

           <!-- 注釋標簽:注釋的內(nèi)容 -->

          條件注釋:

          條件注釋的作用是:定義只有Internet Explorer才執(zhí)行條件注釋中的html標簽。

          
              <!--[if IE 8]>
                  .... some HTML here ....
              <![endif]-->

          HTML骨架:

          <!DOCTYPE html> <!-- 聲明文檔類型版本為html5 -->
          <html lang="en"> <!-- 網(wǎng)頁的跟標簽,lang=""用來設置網(wǎng)頁語言,其值還有zh-CN中文簡體、fr法語等,設置后當系統(tǒng)設置語言和網(wǎng)頁語言發(fā)生沖突時會提示是否翻譯網(wǎng)頁 -->
              <head> <!-- 網(wǎng)頁的頭部 -->
                  <meta charset='UTF-8'> <!-- 聲明字符編碼,其值還有g(shù)bk和gb2312 -->
                  <meta name="viewport" content="width=device-width,user-scalable=no,maximum-scale=1.0,minimum-scale=1.0,initial-scale=1.0"> <!-- 開啟移動端視口 -->
                  <meta name="apple-mobile-web-app-capable" content="yes"> <!-- 開啟ios快捷啟動方式 -->
                  <meta name="apple-mobile-web-app-status-bar-style" content="black"> <!-- 設置iOS頂部通欄樣式 -->
                  <meta name="format-detection" content="telephone=no"> <!-- 遇到數(shù)字不轉(zhuǎn)成電話號碼 -->
                  <meta http-equiv="X-UA-Compatible" content="ie=edge"> <!-- X-UA-Compatible是針對IE瀏覽器做兼容的,ie=edge表示兼容edge,若后面ie=7,則表示兼容IE7 -->
                  <meta name='keywords' content='This is a key words'> <!-- 網(wǎng)站搜索關(guān)鍵字 -->
                  <meta name='description' content='this is description'> <!-- 描述網(wǎng)站的信息 -->
                  <link rel="shortcut icon" type="image/x-icon" href="圖片路徑 "/> <!--  網(wǎng)站的圖標,如果圖標是gif圖,則需要改:type="image/gif",引入網(wǎng)站圖標另一種方法:命名為favicon.ico文件放到網(wǎng)站根目錄下 -->
                  <link rel="stylesheet" type="text/css" href="css文件路徑"/> <!-- 引用css文件 -->
                  <base target="_blank"/> <!-- base標簽,定義這個網(wǎng)頁中a鏈接打開窗口的方式,其值還有_self -->
                  <title>標題</title> <!-- 網(wǎng)站的標題 -->
                  <style type="text/CSS">  /* 用來寫CSS代碼,type="text/CSS"可以省略 */
                      div{width:100px; height:100px; color:white;}
                  </style>
              </head>
              <body> <!-- 網(wǎng)頁的主體 -->
                  <h1>標題</h1> <!-- 標題標簽,共六個級,分別為:h1~h6,大小逐級遞減,h1在一個網(wǎng)頁中只允許出現(xiàn)一次。 -->
                  <p>段落</p> <!-- 段落標簽 -->
                  <hr/> <!-- 單線標簽,所有單標簽后面的關(guān)閉符均可以省略 -->
                  <br/> <!-- 換行標簽 -->
                  </div></div> <!-- 無語義化標簽布局用,上面的標簽是語義化標簽 -->
                  <span>span</span> <!-- 無語義化標簽分割用 -->                
                  <strong>加粗</strong> <!-- 加粗標簽 -->
                  <b>加粗</b> <!-- 加粗標簽 -->
                  <i>傾斜</i> <!-- 傾斜標簽 -->
                  <em>傾斜</em> <!-- 傾斜標簽 -->
                  <s>刪除線</s> <!-- 刪除標簽 -->
                  <del>刪除線</del> <!-- 刪除標簽 -->
                  <u>下劃線</u> <!-- 下劃線標簽 -->
                  <ins>下劃線</ins> <!-- 下劃線標簽 -->
                  <img src="圖片路徑" alt="圖片無法加載,提示文字" title="鼠標懸停,提示文體" border="2"/> <!-- 圖像標簽,border是邊框?qū)傩裕瑆idth和height屬性設置圖像的寬度和高度 -->
                  <a href="跳轉(zhuǎn)目標" target="_self">鏈接的命名</a> <!-- 鏈接標簽,target屬性為鏈接頁面打開的方式,默認值_self為自身打開;_blank為新窗口打開;_new為新窗口打開,相同頁面只會打開一個;_top跳出框架-->
                  <ul> <!-- 無序列表 -->
                      <li>列表項1</li>
                      <li>列表項2</li>
                      <li>列表項3</li>
                  </ul>
                  <ol type="A"> <!-- 有序列表,屬性type可以控制li序號的樣式,其屬性值有:1、A、a、I、i-->
                      <li>中國</li>
                      <li>美國</li>
                      <li>英國</li>
                  </ol>
                  <dl> <!-- 自定義列表 -->
                      <dt>分類1</dt> <!-- 分類名稱 -->
                      <dd>分類1第1項</dd> <!-- 類的項 -->
                      <dd>分類1第2項</dd>
                      <dt>分類2</dt>
                      <dd>分類2第1項</dd>
                      <dd>分類2第2項</dd>
                  </dl>
                  <table> <!-- 定義表格,table標簽實際就是一個四方塊框框,里面有單元格才會顯示出表格的樣子 -->
                  <caption>信息表</caption> <!-- 表格標題 -->
                  <tr> <!-- 定義行 -->
                      <th>姓名</th> <!-- 定義表頭,表頭文本有加粗居中效果 -->
                      <th>年齡</th>
                      <th>性別</th>
                  </tr>
                  <tr> <!-- 定義行 -->
                      <td>小明</td> <!-- 定義單元格,表格里面沒有列-->
                      <td>18</td>
                      <td>男</td>
                  </tr>
                  </table>
              </body>
          </html>

          提示:本文圖片等素材來源于網(wǎng)絡,若有侵權(quán),請發(fā)郵件至郵箱:810665436@qq.com聯(lián)系筆者刪除。

          筆者:苦海123

          其它問題可通過以下方式聯(lián)系本人咨詢:

          QQ:810665436

          微信:ConstancyMan

          個人編寫HTML使用的軟件是dreamweaver,這個軟件的話,正版是要購買的,一開始學習HTML就是用的這個軟件了,挺好用的,而且代碼提示特別方便,不用擔心太多的標簽和屬性記勞~

          1.什么是HTML?

          • HTML 是用來描述網(wǎng)頁的一種語言,指的是超文本標記語言: HyperText Markup Language;
          • HTML 不是一種編程語言,而是一種標記語言;
          • HTML文檔也叫做 web 頁面;

          2.HTML基本結(jié)構(gòu)

          • <!DOCTYPE html>:文檔聲明;
          • <html>:HTML 頁面的根元素;
          • <head>:用于定義文檔的頭部,是所有頭部元素的容器;
          • <meta>:提供有關(guān)頁面的元信息,位于文檔的頭部,不包含任何內(nèi)容;
          • <title>:文檔的標題;
          • <body>:定義文檔的主體,包含文檔的所有內(nèi)容;

          3.HTML標簽使用?

          • HTML 標簽是由尖括號包圍的關(guān)鍵詞,且通常是成對出現(xiàn)的如<a></a>,當然也有單個的,只不過比較少如<hr>
          • 標簽對中的第一個標簽表示開始標簽,第二個標簽表示結(jié)束標簽;

          4.HTML常用標簽介紹

          除了HTML基本結(jié)構(gòu)的幾個標簽以外,HTML還有一些比較常用的基本標簽;

          (1)文本標簽:

          • h1-h6:用于定義標題,h1為最大標題,h6為最小標題;
          • p:定義段落;
          • span:組合文檔中的行內(nèi)元素;
          • br:換行;
          • hr:水平線;
          • strong/b:加粗文字;
          • em/i:斜體;
          • u:下劃線;
          • s:刪除線;
          • pre:定義預格式化的文本,保持原有格式;
          • sub:下標;
          • sup:上標;
          • blockquote:塊引用;

          (2)布局標簽:

          • div:定義文檔中的分區(qū)或節(jié),把文檔分割為獨立的、不同的部分;
          • header:定義頁面的頭部;
          • aside:用作文章的側(cè)欄;
          • section:定義文檔中的節(jié);
          • footer:定義文檔或節(jié)的頁腳,通常包含文檔的作者、版權(quán)信息、使用條款鏈接、聯(lián)系信息等;
          • article:規(guī)定文章獨立的其他內(nèi)容,如標題、內(nèi)容、評論;

          (3)多媒體標簽:

          • img:用于在網(wǎng)頁中插入圖像;
          • audio:定義聲音,比如音樂或其他音頻流;
          • video:定義視頻,比如電影片段或其他視頻流;

          (4)超鏈接標簽:

          • a:定義超鏈接,指定頁面間的跳轉(zhuǎn);

          (5)序列化標簽:

          • ul:定義無序列表;
          • ol:定義有序列表;
          • li:定義列表項目,可用在無序列表ul和有序列表ol中;
          • dl:定義了定義列表;
          • dt:定義了定義列表中的項目(即術(shù)語部分);
          • dd:在定義列表中定義條目的定義部分;

          (6)表格標簽:

          • table:定義 HTML 表格;
          • tr:定義表格的行;
          • td:定義表格的單元;
          • th:定義表頭;
          • caption:定義表格標題;
          • col:為表格中一個或多個列定義屬性值;
          • colgroup:用于對表格中的列進行組合,以便對其進行格式化;
          • thead:定義表格的表頭;
          • tbody:表格主體,也就是正文部分;
          • tfoot:定義表格的頁腳(腳注或表注);

          (7)表單標簽:

          • form:用于為用戶輸入創(chuàng)建 HTML 表單;
          • input:用于搜集用戶信息;
          • button:定義一個按鈕;
          • select:創(chuàng)建單選或多選菜單;
          • option:定義下拉列表中的一個選項;
          • textarea:定義多行的文本輸入控件;
          • label:為 input 元素定義標注(標記);
          • fieldset:用于將表單內(nèi)的相關(guān)元素分組;
          • legend:為 fieldset 元素定義標題;

          5.HTML注意事項

          • HTML文件當以后綴名為 .html 或 .htm 來命名;
          • HTML標簽和屬性是不區(qū)分大小寫的,建議HTML標簽和屬性都小寫,屬性值必須用雙引號包圍;
          • HTML標簽都是以開始標簽起始,以結(jié)束標簽終止;
          • HTML標簽之間盡量縮進與換行,每行代碼不要過長,方便閱讀和維護;
          • HTML標簽使用必須符合標簽嵌套規(guī)則,如禁止a標簽嵌套a標簽,p標簽嵌套div標簽等;
          • 建議不使用HTML已經(jīng)廢棄的或者不贊成使用的標簽,少使用table布局、iframe框架嵌套以及flash播放器;

          主站蜘蛛池模板: 久久国产免费一区| 在线视频一区二区三区| 亚洲爆乳精品无码一区二区| 国产成人精品一区二区三区| 一区二区三区精品高清视频免费在线播放| 色狠狠色狠狠综合一区| 亚洲福利视频一区二区三区| 无码中文字幕人妻在线一区二区三区| 亚洲视频一区二区三区四区| 怡红院美国分院一区二区| 大帝AV在线一区二区三区| 无码人妻精品一区二区三区不卡| 国产精品xxxx国产喷水亚洲国产精品无码久久一区 | 国产在线观看91精品一区| 成人无号精品一区二区三区 | 波多野结衣一区二区三区88| 亚洲AV成人精品日韩一区| 性色AV一区二区三区无码| 秋霞鲁丝片一区二区三区| 午夜精品一区二区三区在线观看| 高清无码一区二区在线观看吞精| 一区二区三区在线| 上原亚衣一区二区在线观看| 国产在线精品一区二区高清不卡| 中文字幕人妻丝袜乱一区三区| 久久国产精品一区免费下载| 中文无码一区二区不卡αv| 国产精品一区二区电影| 国产精品 视频一区 二区三区| 久久精品亚洲一区二区| 精品深夜AV无码一区二区老年| 国产一区二区三区小向美奈子| 无码人妻一区二区三区在线水卜樱 | 中文字幕一区二区精品区| 99偷拍视频精品一区二区| 无码精品黑人一区二区三区| 一区二区三区中文| 免费无码A片一区二三区| 久久国产午夜一区二区福利| 中文字幕一区二区在线播放| 国产成人免费一区二区三区|