以前我們要做網頁圓角時，最早是將圓角做成8張圖片，把table畫成九宮格去插入、去設背景；到現在好一些，可以將圓角切成2張圖用div去設定；或是用一堆的1px去定位、去堆疊。 以往這樣切圖切到最後都會瘋掉，尤其是只是要一個單純的圓角。 幸好css3有了這一項新的技術，我們可以直接用語法設定圓角，不用再切一堆圖了。 css3公佈的圓角語法為border-radius，雖然現在還沒完全正式定案，但是已經有許多瀏覽器利用這個函式，......繼續閱讀 »

這次想跟大家分享的主題是常見的CSS+DIV的問題，這些是我自己曾經碰過，或是工作上、朋友會問我的問題，我想也許許多CSS的初學者也會有這些疑惑，所以把它做個整理。 另外要強調的一點是，我的工作=\=css人員，不是每天都在那邊寫css啦~。我的工作是網頁設計(設計是個多麼美妙的詞阿)，所以會大量用到PhotoShop以及Flash軟體，拜託別再問我「你是不是每天都在寫CSS」這種問題，我不想回答了 。 Q.如何讓DIV區塊居中？ A.......繼續閱讀 »

微軟推出的IE8對於css兼容性已經算高了，許多版面在火狐和IE8之間比較並沒有太大的差別。 但如果你願意... IE8仍然是有hack可以利用低。 @文章轉載自北京的虹的日誌 \9 ：ex.margin:0px auto\9; ，這裡的 \9 可以區別所有IE和FireFox. * ：IE6、IE7可以識別，IE8、FireFox不能 _ ：IE6可以識別，IE7、IE8、FireFox不能 簡易用法： .color{ background-color: #CC00FF; /*所有瀏覽器都會顯示為紫色*/ background-color: #FF......繼續閱讀 »

最近在修正公司某些跑版的問題，發現當使用asp.net的label元件拉文字的時候，他會自動幫你添加成span屬性，而當文章一長、原作者也未排版時，在火狐瀏覽器沒辦法自動換行。 如果需要解決此問題，只寫word-break:break-all;是沒有作用的。大家不妨參考這篇css之自動換行裡所提到的方法。 在這部分我所用的方法是他提出的第二點，我直接在label元件裡加上style="white-space:normal;overflow:hidden;width:500px;" 雖然他裡頭......繼續閱讀 »

昨天才發了一篇快速寫好css的5種方法，第一點開宗明義提到要使用css重置表(reset.css)，我在翻譯的時候有在後頭特別註明一下reset.css的觀念。老實說，本來想點到為止，但是今天卻偶然讓我發現內地的朋友寫了一篇「打造自己的reset.css」，不知是巧合還是註定？總之就把這篇分享給大家閱覽吧。 我覺得這篇文章寫的還不錯，但是裡頭很多元素平常人是不會去接觸的，所以在此我簡單解釋一下幾個html標籤、屬性的應用。 1. <......繼續閱讀 »

這次翻譯自NETTUTS的文章，作者為Trevor Davis。其實他點出的這五點不能說是寫css的一種捷徑，但我認為就初學者而言，確實可以培養這種不錯的撰寫習慣。畢竟css的語法是死的，所以大家能推出的觀點就是針對撰寫習慣而言。當然以下五點都是很多css designer知道的事情，只是在於你要不要去實踐罷了。 原文出處： @ 5 Ways to Instantly Write Better CSS / Trevor Davis 譯者： @ muki / MUKI space* 1.CSS重置 Photo by red......繼續閱讀 »