HTML 5 與 CSS 3
出自KMU Wiki
網頁誰發明？
- 提姆·柏內茲-李 ( Tim Berners-Lee )
- What is HTML?
- HTML
- HTML(Hyper Text Markup Language)是描述網頁的一種語言（有語病:)）。現在由W3C(World Wide Web Consortium) 制定其標準。目前為HTML5.2（2017年Dec.）。
- 歷史
- HTML+ (1993)
- HTML 2.0 (Nov. 1994)
- HTML 3.0 (1995)
- HTML 3.2 (Jan. 1997)
- HTML 4.0 (Dec. 1998)
- HTML 4.01
- HTML 5 (Oct. 2014)
- HTML
- 深入一點點
- SGML
- SGML(Standard Generalized Markup Language)一種通用的電子文件標準。其中一個重要特性為
- SGML
DTD(Document Type Definition,文件格式定義)。列為ISO8879(1996)標準。
- XML
- XML(eXtensible Markup Language)為綜合HTML及SGML特徵的語言，同時具有DTD特性，也具有相當簡短性。1998年由W3C推出XML 1.0
- XHTML
- 2003年10月提出，利用HTML tag實作XML。現在為XHTML 2.0 (2004 July)
- XML
- 為什麼要學HTML
- 寫網頁一定要會嗎？
- 不一定
- 但知道就不會寫「爛」網頁
- 會了一定能寫好網頁嗎？
- 不見得
- 美工必須要有一點天份:-p
- 但至少可以使用久一點的網頁
- 不見得
- 還有....
- 你可以看得懂別人的把戲
- 可以用在blog客製化
- 寫網頁一定要會嗎？
- What is URL?
- URL
- URL(Universal Resource Locator)即一般所謂的網址。
- 格式
- 服務方式://IP address or Domain name
- 如：http://www.psy.kmu.edu.tw
- or ftp://ftp.kmu.edu.tw
- URL
- URI
- Uniform Resource Identifier
- 多了path
- 將resource特定的方法
- Uniform Resource Identifier
- URI
- HTML的真象
- Tag language
- <html>
- <head>
- <title> Test </title>
- </head>
- <body>
- 這裡寫內文
- </body>
- </html>
- What is Tag?
- 被<與>所夾的部分就是tag，瀏覽器（browser）將其解讀為命令。並執行。
- Tag language
- 另一種Tag language
- RTF
- {\rtf1\ansi\ansicpg950\deff0\deflang1033\deflangfe1028{\fonttbl{\f0\fswiss\fcharset0 Arial;}{\f1\fnil\fcharset136 \'b7\'73\'b2\'d3\'a9\'fa\'c5\'e9;}} \viewkind4\uc1\pard\lang1028\f0\fs20 RTF\lang1033 also is a tag language\par RTF\lang1028\f1\'ae\'e6\'a6\'a1\'a4\'5d\'ac\'4f\'bc\'d0\'c5\'d2\'bb\'79\'a8\'a5\'a1\'43\par \par }
- 解碼（用Wordpad即可，如下）
- RTF also is a tag language
- RTF格式也是標籤語言。
- RTF
- 常用tag簡介
- 最外層
- <html>..........................</html>
- 開頭
- <head>..........................</head>
- 非本體，平常用瀏覽器看不到的部分。
- 包含：標題、動態文件（META，例如：
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">）
- 或javaScript、VBScript等（現在不太推薦）。
- 最外層
- 常用tag簡介之二
- DTD
- Document Type Definition
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="utf-8" lang="utf-8">
- <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- DTD要放在開頭
- Document Type Definition
- 以上是4.01的，現在
- <!DOCTYPE html>
- DTD
- 常用tag簡介之三
- Title
- <title>.............</title>
- title的重要性，在於方便使用者。
- 密笈
- <!開頭為註解，雖然瀏覽者看不到，但搜尋引擎滿注意的。
- Title
- 常用tag簡介之四
- 本文
- <body>.............................</body>
- 屬性
- 有些標籤另有其屬性，可以增加的功能。如body中指定背景顏色、背景圖等等。（強烈不推薦）
- <body bgcolor=#ffff00>
- or <body background="filename.gif">
- 插入圖形
- <img src="filename">
- 可以有很多控制屬性，其中alt滿有用的。
- 本文
- 常用tag簡介之五
- 超聯結
- <a>必接的屬性為href，所以常見的形式為<a href="URL">
- CSS
- Cascade Style Sheet
- <LINK REL="STYLESHEET" TYPE="text/css" HREF="style.css">
- Cascade Style Sheet
- 超聯結
