X

(初學) 網頁設計之HTML語法教學 - 基本介紹

分類 精選文章
發佈日期 2010 , 06 , 05
觀看人數 12333
回應 0

HTML - 超文件標示語言(英文:HyperText Markup Language,簡稱為HTML),被用來結構化資訊 例如標題、段落和列表等,也可用來在一定程度上描述文檔的外觀和語意。

而或許一般大眾認為HTML不是網頁設計師才需要懂的語法嗎?但其實在現今網路普及的社會上,多少了解一些對您的幫助可說是有益而無害,例如在撰寫Blog抒發心情時,總想把網頁設計的美美的,但有時Blog所提供的HTML編輯器又有些功能上的限制,所以只好從HTML下手囉!

因此奈思網頁設計將在此提供一系列的HTML語法說明與教學,對於網頁設計的初學者請鎖定本站相關訊息喔!

而第一篇就來和大家說明,一般我們最常見的Html標籤

  1. 標題字 由h1~h7
    • 標題字

    • <h1>標題字</h1>
  2. 字體大小 由1~7
    • 字體大小
    • <font size="1">字體大小</font>
  3. 字體顏色
    • 字體顏色
    • <font color="#cccc00">字體顏色</font>
  4. 字體背景色
    • 字體背景色
    • <font style="background-color: #9900ff">字體背景色</font>
  5. 粗體字
    • 粗體字
    • <strong>粗體字</strong>
  6. 斜體字
    • 斜體字
    • <em>斜體字</em>
  7. 底線字
    • 底線字
    • <u>底線字</u>
  8. 段落文字
    • 段落文字

    • <p>段落文字</p>
  9. 換行
    • 第一行
      第二行
    • 第一行<br />第二行
  10. 連結
    • 網頁設計高手!
    • <a href="http://www.nim.com.tw/index.php">網頁設計</a>高手!</a>
  11. 圖片
    • <img src="http://nim.com.tw/upload/content/20090422a51c9.jpg" />
  12. div區塊,並指定CSS樣式
    • div區塊
    • <div style="padding-right: 5px; padding-left: 5px; font-weight: bold; font-size: 12px; background: #666666; padding-bottom: 5px; width: 100px; color: #ffffff; padding-top: 5px; height: 25px">div區塊</div>
  13. 表格
    • 名稱 總類 數量
      蘋果 水果 100
    • <table width="100%" border="1" cellspacing="0" cellpadding="5">
      <tr>
      <th>名稱</th>
      <th>總類</th>
      <th>數量</th>
      </tr>
      <tr>
      <td>蘋果</td>
      <td>水果</td>
      <th>100</th>
      </tr>
      </table>
以上加以舉一反三,可變化許多的樣式,例如圖片加上連結

<a href="http://www.nim.com.tw/index.php"><img src="http://nim.com.tw/upload/content/20090422a51c9.jpg" /></a>

您是否注意到大部分HTML標籤都是由 <>內容物</> 這樣的組成的呢?

分類 精選文章
發佈日期 2010 , 06 , 05
觀看人數 12333
回應 0

Leave a reply

名稱
Email
Post
0 Comments