Tuesday, May 27, 2008
[XHTML] DOCTYPE (引用外部 DTD 規範)
Blog玩了這麼久，從來沒有手動從頭打造過一個網站，以致於一些細節的部份，都沒注意到，導致我浪費很多時間在Debug一個怪問題，還以為IE又Sucks了勒..囧。就是在弄和Browswer Compatibility(IE6、IE7、Firefox、Safari)有關的issue時，由於要打造一個"盡量"能夠在外觀上一致的Web User Interface，一直在搞CSS Hack這玩意兒，但卡在某個關卡，一直找不出為何css hack一直失敗，原本還想說，該死的M$又有新的patch導致IE6、IE7又可以識別某些特殊的selector了，害我一直找新的css hack，但沒想到是自己耍白痴，沒有基本常識，連 <!DOCTYPE> 這個最基本的東西都沒加到，當然css hack一直失效啦...OMFG，害我花了兩個多小時，結果玩了更多的CSS Hack，盡是一些「奇淫技巧」...Orz。
因此，我學到了，在寫XHTML的第一步就是記得聲明符合自己需要的DOCTYPE，但這些DOCTYPE又有許多Branch，要深入了解，得再花些時間，遵循"有名"大站的DOCTYPE來試試，不失為一個好方法。
※Blogger.com以及Facebook所使用的為，嚴格的(Strict):要求嚴格的DTD，你不能使用任何表現層的標識和屬性<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
※著名的設計大師Zeldman個人網站使用的是過渡的(Transitional):要求非常寬鬆的DTD，它允許你繼續使用html4.01的標識(但是要符合xhtml的寫法)<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
引述自此站：
如果 HTML 缺少第一行的 DOCTYPE 設定，將會使得瀏覽器無法在「標準模式」下顯示 CSS 效果！
缺少第一行的 DOCTYPE 設定時，瀏覽器會變成 Quirks 模式， Quirks 模式有人翻譯為「舊版相容模式」、有人翻譯為「怪癖模式」...... 主要都是會讓網頁無法正確顯示 CSS 的正確效果，變成和 IE5 差不多的舊式效果！
因此以在 HTML 中的第一行一定要有 DOCTYPE 的宣告設定！XHTML 目前已發展到 XHTML 2.0 版本，但是在現今瀏覽器與 CSS 整合上的應用還是以 XHTML 1.0 版本的相容性最好， XHTML 1.1 以後語法的改變差異太大，有些常用的網頁語法都不能用了，因此目前最多人使用的還是 XHTML 1.0 版本。※參考資料來源：
XHTML1.0 的文件架構
21 Comments:
When: June 15, 2008 4:36 PM
When: June 15, 2008 10:06 PM
To 原上草:
請參見此篇文章
http://jinyaolin.blogspot.com/2007/08/blogger8242007.html
When: July 03, 2008 5:56 PM
I' can' t understand nothing because I'm Italian but you blog is very cool
When: July 05, 2008 11:56 AM
凯歌，你解答错了，我说的是你的那个上面的那个navbar的自动隐藏/出现是怎样弄出来的 ，我试了很多次都不行啊 。还又我采用的模板是你的，而我却没有加入什么太多的HACKS，而速度却慢得要命，我不知道是什么原因，帮我检查一下吧！！我的地址是：gspysc.blogspot.com
When: July 06, 2008 11:57 AM
To Gummy:
Thanks for your appreciate!! Maybe Google Translate is a solution, like this http://0rz.tw/834q0
When: July 06, 2008 12:04 PM
To igroot:
喔喔，原來你指的是那個玩意呀!!那你得研究一下prototype.js這個javascript framework所提供的 Effect.toggle()這個函數用法!很慢唷? 你是用Firefox吧，我用Firefox開你的Blog挺快的說，我也不清楚是什麼問題..XD
When: July 09, 2008 4:54 AM
Thank you from Poland
When: July 09, 2008 6:54 PM
google translate is cool, but try to have some english post too. btw im using google transalte to read my friends blog in pingtung.
When: July 09, 2008 6:56 PM
and btw. just click on my name to visit my blog. tnx
When: July 10, 2008 1:20 AM
To Boszkowo:
Thanks...what..^_^ anyway thanks GOD
To chinese fighting muffins:
I would try to ...thx for your advice!
When: August 15, 2008 2:19 PM
When: August 29, 2008 4:01 PM
yeahhhhhhhhhhhhh
When: September 15, 2008 5:09 AM
omgg ur baby picture on technorati is so cute
:D
When: September 15, 2008 10:05 PM
To Anonymous:
haha... thx for ur aprpeciate!
When: December 09, 2008 12:48 PM
在地ㄚ晟這次有幸入圍『藍眼關注』，感謝各位長期以來的支持。既然入圍便需要您的選票來肯定。請您不吝的投下這一票，為ㄚ晟爭取更高的榮譽與分享的動力，謝謝您。
http://notebook-it.blogspot.com/2008/12/blog-post_06.html
When: December 17, 2008 9:11 AM
那個 ...
為什麼 妳的BLOG
很卡的感覺
捲文章 捲不太動耶 ...
是因為太多Js的關係?..
When: December 17, 2008 9:40 PM
To Anonymous:
我個人使用上倒是沒有明顯的感覺，若使用IE的話，那的確會比較容易發生卡卡的問題，印像中某些transparent的參數對於IE的loading比較重!!
When: February 23, 2009 8:30 AM
SEO課程
網站登錄
When: April 06, 2009 7:19 AM
大大您好（不好意思，若發問位置不正確，請包涵^^）：
不好意思，有一個問題一直在我心中很久了，不過一直無解…
我管理了許多Blog，部分是直接套用無腦包，部分是自己改版型（一個功能一個功能加），不過後來都遇到一個問題，就是加入「表格」(table)功能時，Firefox、chrome都看得到，但是IE就看不到table裡的東西了…（完全不見）
請問有什麼地方可以調整嗎？（小弟不會寫程式，只會按著網路上的說法設定而已）
請參考 http://seed.hans543.com ，分別用IE和Firefox開，看到Blog的最下方，應該有兩本相簿才對，但是IE看不到…
（我的個人Blog是 http://hans543.com ，不過也是遇到這個問題，結果都沒辦法使用表格來編排版面…）
再請大大解惑了，感謝感謝 Orz（跪）
When: April 06, 2009 11:03 PM
To 翰仔:
這本 http://seed.hans543.com/ 我用啥browser看，底下都沒有相簿耶...
然而這個 http://hans543.com 的話，我用FF跟IE6都有耶..XD
糟糕...然不成是你解決了!!
When: April 06, 2009 11:15 PM
Dear 大大好！
感謝您的回覆，
真是不好意思，小弟已解決了啦^^
（另有一位高人指點了^^）
感謝感謝您的熱心回覆^^
Orz（跪）
Plz Post a Comment / 拜託你留個言啦...^^"