Title1

Title2

Title3

5. HTML區塊元素與樣式表使用

HTML5塊元素標籤的使用

本單元通過講解HTML區塊元素行內元素等,掌握HTML區塊元素,並認識HTML5區塊元素

  1. HTML區塊元素(block)
    區塊元素在顯示時,通常會以新行開始,高度,行高以及頂和底邊距都可控制,寬度預設是它的容器的100%,除非設定一個寬度。
    <h1> <p> <ul>
    sublime 假字 lorem
  2. HTML行內元素(inline)
    行內元素通常不會以新行開始,高,行高及頂和底邊距不可改變;寬度就是它的文字或圖片的寬度
    <b> <a> <img>
    <a href="7-1.html" target="_blank">7-1.html</a>
  3. HTML <div> 元素
    <div>元素是區塊元素,其主要是組合 HTML的容器
  4. HTML <span>元素
    <span>元素是行內元素,可做為文本的容器
  5. 更多標籤:http://www.w3school.com.cn/tags/

HTML樣式

本單元講解HTML樣式,包含基本標籤、屬性、三種樣式表插入方法(外部樣式表、內部樣式表、內聯樣式表)

  1. 標籤:
    <style>:樣式定義
    <link>:資源引用
  2. 屬性:
    rel="stylesheet":外部樣式表
    type="text/css":引入文檔的類型
  3. 三種樣式表插入的方法:
    外部樣式表:
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    

    內部樣式表:
    <style type="text/css">
    hr {color: sienna;}
    p {margin-left: 20px;}
    body {background-image: url("images/back40.gif");}
    </style>
    

    行內樣式表:
    <p style="color: sienna; margin-left: 20px">
    這是行內樣式表
    </p>