CSS – 什麼時候該使用IDs 或 Classes

很多人在開始學CSS的時候徑常對於什麼時候該使用ID 或 Class有混淆的感覺。這是因為基本上它們的使用功能可以說是一樣的。這一則簡短文章將說明為什麼要有這兩個元件及它們的不一樣性在那裡。

什麼是ID 選擇器

跟據W3C的說法，「ID在每個HTML文件裏應該是要獨一無二的」。意思是說如果你有一個ID叫content，那這個ID在相同的文件裡應該只會出現一次。

在同一個HTML文件上的重復性

1. 同樣一個Class名稱可以在同一文件上重復使用
2. 同樣一個ID名稱只能在同一個文件上使用一次

因此，如果你想要在一個文件上，使用一次以上而且是同樣的名稱的CSS Selector，Class會是最好的選擇。

結合classes selector

你可以使用多重的classes在同一個HTML element, 例如 <_p class="highlight indent">。但是對ID而言你只能夠使用一次。

IDs比Classes 有更高的繼承性

在很多時候你可能會遇到同樣一個HTML element 同時被 id和class宣告，如列子一。如果這種衝突發生 ID 名稱content的font-weight:bold 將會被選擇。

列子一

#content { font-weight: bold; }
.content-heading { font-weight:normal; }

<_div id="content" class="content-heading">

內容 ->

<_/div>

結論是，IDs 和Classes是提供給網頁設計人員更多的選擇性，讓設計人員在設計網頁結構時能更有組織性。

UTF-8, 使用mailto 出現亂碼問題，用PHP解決

如果在HTML裏直接放這段，當你用打開Outlook打開時會出現亂碼

<_a href="mailto:mark@creach.com.tw?submit=聯絡我們">聯絡我們<_/a>


解決方法是用下面這一段PHP code:

<_?php
echo htmlentities(urlencode(iconv("utf-8","big5","聯絡我們")));
?>


這時你會看到一段Code像 「%C1p%B5%B8%A7%DA%AD%CC」，在把這一段放在 mailto的submit裡，像下面這像，這樣的話亂碼問題就解決了。

<_a href="mailto:mark@creach.com.tw?submit=%C1p%B5%B8%A7%DA%AD%CC">聯絡我們<_/a>



P.S. 我是故意在 tag 裡加上 _ ，不然的話 HTML code 無法正常顯示。

學習 ActionScript 3.0 的建意!

雖然同樣是叫ActionScript，但是它是被完全重新設計過的，是根據 ECMAScript (The International Standardized Programming Language For Scripting)的標準所建立的全新語言。在效能上也比ActionScript 2.0快上十倍，而在物件導向(object-oriented)概念下，讓開發人員能夠重新使用原有的元件，達成迅速建立 Rich Internet Applications (RIA)的目的。

以下的列表是一些建意以及一般在開發過程中會遇到的一些問題:

• 宣告所有的變數(variables)類別(types)，以及參數(parameters)和回傳形態(return values)。雖然做上面那些動作不是必須的，但是這種寫程式的方式是被專家認同及考慮過最好的開發習慣。另外這麼做的好處是，當編輯器在compiler 程式碼時能更有效的提供錯誤訊息。而且它還能夠提升效能，因為虛擬機器(virtual machine)事先就知道變數類別是什麼及回傳的資料形態應該要是什麼。
• 永遠宣告函數(function)所要回傳的資料形態是最好的開發習慣。如果你忽略回傳形態系統會出現警告訊息，而這麼作是為了安全考量，所以開發人員不會不小心沒寫回傳形態因而接受到物件(object)回傳值，因為程式的回傳初始值是物件。
• 另外，值的注意的是ActionScript 2.0 不管是宣告Classes，Functions，variables時，它的初始值都是public。但是ActionScript 3.0 對於這些宣告初的始值都是private，意思是”只有在內部可以使用”。 而這個部份的不一樣性對於剛剛從ActionScript 2.0 到 3.0 的人而言可能是其中一個最常遇到的問題。
• 對於處理XML檔案格式的方法，在ActionScript 3.0推薦E4X (ECMAScript for XML)。E4X是ActionScript 3.0新的方法用來處理XML格式的資料，它比原有的Flash XML class更強大。這也讓開發人員在處理XML資料時能更快速及簡單的作資料的處理。雖然如此，Flash XML class 在ActionScript 3.0裏還是存在的就放在flash.xml，提供開發人員更多的選擇。另外，在ActionScript 3.0裡如果使用toString去讀取XML資料，你只會看到XML裡的值，而不會看到XML markup，但你可以使用toXMLString取得XML markup。

如果想要知道ActionScript 3.0 和 ActionScript 2.0 的不一樣性請到 ActionScript 2.0 Migration