Web前端入門學習(2)——HTML常用標籤

來源:互聯網
上載者:User

標籤:html標籤

HTML標籤

  1. a標籤

    a標籤是一個超連結標籤,用於從一個頁面連結到另一個頁面。在《Web前端入門學習(1)》有提到過4個偽類,分別是a:link、a:visited、a:hover、a:active。


    a:link代表的是未訪問過的連結,當訪問者首次開啟網頁未點選連結時,所表現的形式;

    a:visited代表的是訪問過的連結,相對於link,是訪問者點擊了串連後,所表現的形式;

    a:hover代表的是當滑鼠經過連結上面時所表現的形式,滑鼠經過後,連結會有所變化;

    a:active代表的是當使用者點選連結的那一刻,所表現的形式。


    注意:這4個偽類的使用,有一個先後順序,並不是隨便寫就可以的。這裡規定,a:hover必須寫在a:link、a:visited後面,而a:active必須寫在a:hover後面。


    href屬性用於規定連結的目標URL,即連結地址。

    如<a href="http://cherry360.blog.51cto.com/">小倩加油站

    連結開啟檔案預設是在本視窗開啟,如果想在新視窗開啟連結,可以加個target屬性:

    如<a href="http://cherry360.blog.51cto.com/" target="_blank">小倩加油站


  2. span標籤

    span標籤是用於對文檔中的行內元素進行組合,該標籤沒有固定的格式表現。當對它應用CSS樣式時,才會產生視覺上的變化。如果不對<span>應用樣式,那麼該元素中的文本與其他文本不會有任何視覺上的差異。<span>標籤提供了一種將文本的一部分或者文檔的一部分獨立出來的方式。


  3. 標題標籤

    標題標籤有h1~h6,如

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title></head><body><h1>我是標題1</h1><h2>我是標題1</h2><h3>我是標題1</h3><h4>我是標題1</h4><h5>我是標題1</h5><h6>我是標題1</h6><h7>我不再是標題,而是瀏覽器預設字型~~</h7></body></html>

注意:當超出h6之後,標題標籤不存在,字型顯示跟所開啟的瀏覽器預設字型一致了。


4.其他常用標籤:

 段落標籤:<p>我是段落</p>

 重要文本:<strong>加強</strong>

 強調文本:<em>強調</em>

 .....

 還有很多標籤,詳見:http://www.runoob.com/tags/html-reference.html


5.HTML5新增標籤

 header:定義文檔或文檔的一部分地區的頁首。

 nav:定義導航連結。

 section:定義文檔某個地區。

 footer:定義文檔或文檔的一部分地區的頁尾。

 article:定義獨立內容。內容本身必須有意義而且是獨立於文檔的其他部分。

 aside:定義<aritcle>標籤外的內容,內容與附近的內容有關。

 time:定義西曆時間或日期。

 mark:定義帶有記號的文本,為了反白文本。

 img(跟a連結一樣,是一個單標籤):定義HTML頁面的映像,有兩個必要屬性:src和alt。


本文出自 “小倩加油站” 部落格,請務必保留此出處http://cherry360.blog.51cto.com/12176744/1863510

Web前端入門學習(2)——HTML常用標籤

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.