Más contenido relacionado
Similar a 20121019-HTML5 (20)
Más de Chih-Hsuan Kuo (20)
20121019-HTML5
- 2. HTML 5
當前版本 HTML 4.01
HTML 5:含 HTML、CSS 以及 Javascript
尚未正式推出,大多數主流瀏覽器支援部份功
能,至於 IE...
HTML5 & CSS3 Support
- 3. new tags
section, video, progress, nav, meter,
time, aside, canvas, command, datalist,
details, embed, figcaption, figure,
footer, header, hgroup, keygen, mark,
output, rp, rt, ruby, source, summary,
wbr
- 4. new tag
section, video, progress, nav, meter,
time, aside, canvas, command,
datalist, details, embed, figcaption,
figure, footer, header, hgroup,
keygen, mark, output, rp, rt, ruby,
source, summary, wbr
- 5. new tag
標題
首頁 文章彙整 關於作者 其他
部落格文章
版權宣告
- 6. new tag
<div></div>
<div></div>
<div></div>
<div></div>
- 7. new tag
<header></header>
<nav></nav>
<section></section>
<footer></footer>
- 8. new tag
<header></header>
<div></div>
網頁更富有語意!
<section></section>
<footer></footer>
- 11. removed tags
acronym, applet, basefont, big, center,
dir, font, frame, frameset, isindex,
noframes, strike, tt
- 12. removed tags
acronym, applet, basefont, big,
center, dir, font, frame, frameset,
isindex, noframes, strike, tt
- 15. 動畫製作
- Canvas API
- CSS 3
- Javascript
- http://bit.ly/QnNJ14
- http://bit.ly/QnNxyW
- http://bit.ly/TZZ9yd
- 19. something about HTML
瀏覽器支援不嚴謹的 HTML 語法
<html>
<head>
</head>
<body>
<ol>
<li>資訊週加油阿! </li>
<li>傳情品可以幫我打折嗎?
</li>
<li>不然傳給我也是 OK 的 :)
</ol>
</body>
</html>
- 20. something about HTML
瀏覽器支援不嚴謹的 HTML 語法
<html>
<head>
</head>
<body>
<ol>
<li>資訊週加油阿! </li>
<li>傳情品可以幫我打折嗎?
</li>
<li>不然傳給我也是 OK 的 :)
</li>
</ol>
</body>
</html>
- 21. something about HTML
01: <html>
02: <head>
03: </head>
04: <body>
05: <table border=1>
06: <tr>
07: <td> r1,c1 <td>
08: <td> r1,c2 </td>
09: </tr>
10: <tr>
11: <td> r2,c1 </td>
12: <td> r2,c2 </td>
13: </tr>
14: </table>
15: </body>
16: </html>
- 23. something about HTML
01: <html>
02: <head>
03: </head>
04: <body>
05: <table border=1>
06: <tr>
07: <td> r1,c1 <td>
08: <td> r1,c2 </td>
09: </tr>
10: <tr>
11: <td> r2,c1 </td>
12: <td> r2,c2 </td>
13: </tr>
14: </table>
15: </body>
16: </html>
- 24. something about HTML
01: <html>
02: <head>
03: </head>
04: <body>
05: <table border=1>
06: <tr>
07: <td> r1,c1 </td><td></td>
08: <td> r1,c2 </td>
09: </tr>
10: <tr>
11: <td> r2,c1 </td>
12: <td> r2,c2 </td>
13: </tr>
14: </table>
15: </body>
16: </html>
- 34. Indentation
01: <html> 01: <html>
02: <head> 02: <head>
03: </head> 03: </head>
04: <body> 04: <body>
05: <table border=1> 05: <table border=1>
06: <tr> 06: <tr>
07: <td> r1,c1 07: <td> r1,c1 </td><td></td>
</td><td></td> 08: <td> r1,c2 </td>
08: <td> r1,c2 </td> 09: </tr>
09: </tr> 10: <tr>
10: <tr> 11: <td> r2,c1 </td>
11: <td> r2,c1 </td> 12: <td> r2,c2 </td>
12: <td> r2,c2 </td> 13: </tr>
13: </tr> 14: </table>
14: </table> 15: </body>
15: </body> 16: </html>
16: </html>
- 38. Syntax Highlight
01: <html> 01: <html>
02: <head> 02: <head>
03: </head> 03: </head>
04: <body> 04: <body>
05: <table border=1> 05: <table border=1>
06: <tr> 06: <tr>
07: <td> r1,c1 07: <td> r1,c1
</td> </td>
08: <td> r1,c2 08: <td> r1,c2
</td> </td>
09: </tr> 09: </tr>
10: <tr> 10: <tr>
11: <td> r2,c1 11: <td> r2,c1
</td> </td>
12: <td> r2,c2 12: <td> r2,c2
</td> </td>
13: </tr> 13: </tr>
14: </table> 14: </table>
15: </body> 15: </body>
16: </html> 16: </html>
- 40. Zen Coding
div#page>div.logo+ul#navigation>li*5>a
<div id="page">
<div class="logo"></div>
<ul id="navigation">
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</div> 影片:http://vimeo.com/7405114