觀看範例一 :http://design2u.me/example/time/time.php
Archive for html
製做 CSS table 1 pixel 細框線
一般來說,1px 其實是件很美的事情
很多事情在多了 1px 之後,美感就會有很大的提升
剛學到一課,就是將一般 html 的 table 框線變成 1px
因為,即使你原本在 html 當中設定了
<table border="1">
它還是會因為 “ 預設框線不重疊” ,而造成其實是 2px 的像素框線
HTML5 相關概念整理
這篇文章主要紀錄一些 HTML 5 的相關訊息
分為以下幾個部份
一、前言
HTML5 是新版本的 html, xhtml , 為了改進 html 之前版本所出現的相容性問題, 且加強 元件控制、多媒體與程式繪圖等等功能, 並統一了許多的標準, 讓跨瀏覽器之間的支援度提升
二、支援瀏覽器
大致來說, Chrome, Opera, Safari, Firefox 等等瀏覽器支援度較高, 而 IE 支援度較差, 這個 網站有提供許多服務支援與不支援的列表。
三、著名 HTML5 服務
1. Sketchpad – 一款基於 html5 的線上繪圖工具
2. Apple HTML5 showcase – 蘋果公司為了推 HTML5, 列出用 html5 可以呈現的一些結果
3. Rgrahp – html5 所開發的圖形 library
四、Apple 與 Adobe 的戰爭
Adobe 公司所開發的 flash 取得網路多媒體播放的 90% 以上之安裝率, 但 apple 公司的官方態度卻不支援, 甚至明爭暗鬥, 這篇 文章有蠻深的一些描述。所以 Apple 公司一直希望能夠推廣 HTML5 的多媒體播放能力, 以取代 Flash 的市場獨霸地位。
五、大致功能上的改變
1. 影片播放 – 可任意變更大小, 請看 這裡
2. 文字呈現 – 可任何調整大小, 透明度, 斜度, 間隔等等, 請看 這裡
3. 藝廊 – 可做出 2D, 3D 藝廊, 且不用第三幫程式來幫忙, 請看 這裡
4. 淡出 – 可做出各種不同的淡入淡出模式, 請看 這裡
5. 360 度旋轉 – 利用 javascript 即可做出三百六十度旋轉的功能, 請看 這裡
6. 可被編輯的文字 – 請看 這裡
8. 漸層式畫布 – 請看 這裡
9. 根據 ip 找到位置 – 請看 這裡 (但我似乎一直試不成功)
10. 本端資料紀錄功能 – 請看 這裡
11. Web SQL – 請看 這裡
12. 整體網頁語法框架的改變 – 請看 這裡
13. 新的資料輸入型態 – 請看 這裡
14. 可任意更改的 column 數目 – 請看 這裡
15. 文字邊框 – 請看 這裡
16.圓角匡 – 請看 這裡
17. 文字陰影 – 請看 這裡
六、結論
觀察 HTML5 相對於 HTML4 所帶來的改變, 大致上在於可以利用 html, css, javascript 刻出許多以前不可能的效果, 這對於提升使用者在使用網路的滿意度, 尤其從前要播放影片或是做出藝廊等等特效的時候都需要依賴 flash 技術, 但 HTML5 不管在影片的播放或是文字、物件特效的表現方面都有提升。但是觀察的結果有發現其實 html5 各瀏覽器支援的程度還是不一致, 尤其 IE 是大部份都沒有支援, 在 IE 全世界市佔率還是最高的情況之下, 我認為 HTML5 在一般電腦平台上還是很難有伸展的空間…, 不過由於智慧型手機的興起, 尤其是 iphone, 並不支援 flash, 甚至推崇 html5, 因此我覺得有可能的發展方向是如果是要給智慧型手機使用的網路服務, 有可能會漸漸的支援 html5 , 但是一般電腦上面看的網站, 還是會以 flash 為主流。到時候最麻煩的, 大概還是網頁設計師們了, 畢竟號稱 html5 能夠有更強的跨瀏覽器能力, 但是平台越來越擴張, 從前 web designer 只需要負責電腦上面的網頁, 但之後這些網頁還要能支援智慧型手機的瀏覽, 應該也會是個挑戰吧。
參考文獻
1. 維基百科
3. W3C – HTML5
6. HTML5 Rocks