Category Archives: CSS

更新 blog css，加上 max-width…

Posted on April 19, 2011 by Gea-Suan Lin

本來圖片過寬會造成頁面有點亂，針對文章內的圖片補一下 max-width，不過這個屬性 IE6 就 sorry 了 XD 上一篇「IPv6 的進展，以及北美 IPv4 流量分析…」用到的圖都有超過，現在看起來應該好一些了…

Posted in Blog, Computer, CSS, Murmuring, Network, WWW | Tagged , , , , , | Leave a comment

產生任意大小的貓圖片…

Posted on March 1, 2011 by Gea-Suan Lin

{placekitten} 這個站提供 API 產生圖片，讓你在規劃版面的時候會比較方便： Like this: http://placekitten.com/200/300 or: http://placekitten.com/g/200/300 像是這樣： 測了幾次，那個 g 應該是指灰階？記得之前有個站是產生純數字的 block image，有誰記得嗎？

Posted in Computer, CSS, Murmuring, Network, Recreation, WWW | Tagged , , , | 3 Comments

用 IE 的 conditional comments 建立 class

Posted on February 28, 2011 by Gea-Suan Lin

IE 的 Conditional comments 可以拿來建立對應的 class，可以減少 css 使用 IE hack 的情況 (有些 IE hack 會使得 css 的語法不正確，用工具壓縮後可能會出問題)，以 IE6 為例，下面的例子可以把 IE6 與 IE7 分別標上 class=”ie6″ 或是 class=”ie7″： <!–[if IE 6]><body class=”ie6″><![endif]–> <!–[if IE 7]><body class=”ie7″><![endif]–> <!–[if gt IE 7]><!–><body><!–<![endif]–> 這個方式不需要 javascript，而且是合法的 … Continue reading →

Posted in Browser, Computer, CSS, IE, Murmuring, Network, Software, WWW | Tagged , , , , , | 1 Comment

Blog 關掉 CloudFront CDN…

Posted on February 21, 2011 by Gea-Suan Lin

剛剛用手機看自己的 blog 發現版面亂掉，看起來是 CSS 有問題… 測了一些東西後發現，如果 W3 Total Cache 使用 CloudFront CDN，會使得 WPTouch 失效，拿掉 CDN 的部份就會恢復正常… 那只好先拿掉了，現在用手機看 blog 的人應該就正常了…

Posted in AWS, Blog, CDN, Cloud, Computer, CSS, Murmuring, Network, Software, WWW | Tagged , , , , , , , | Leave a comment

CSS2 中的 text-shadow 屬性

Posted on January 12, 2009 by Gea-Suan Lin

昨天在家裡的 Firefox 3.1 beta 上玩的很高興，到公司卻發現 Firefox 3.0 還沒支援，不過，可以安裝 Text Shadow 支援之個屬性。(雖然副作用還蠻多的) 據說 Safari 很早就支援，但同樣使用 WebKit 的 Chrome 卻不支援… 可以在 CSS – text-shadow 看瀏覽器是否有支援這個屬性。 補充，這是 Firefox 3.1 下看到的樣子：

Posted in Browser, Computer, CSS, Firefox, Murmuring, Network, Software, WWW | 2 Comments

CSSHttpRequest

Posted on October 24, 2008 by Gea-Suan Lin

CSSHttpRequest 是利用 CSS 的 @import + about: 取代目前常被使用 JSONP，優點在於 JSONP 可能被植入惡意的 javascript code，但 CSSHttpRequest 不會。 不過話說回來，對 IE6/IE7 就不是這樣了 (IE6/IE7 的 CSS 裡可以跑 script)，而 Firefox 3 有提供 cross-domain XHR，CSSHttpRequest 似乎又沒有那麼吸引人了？

Posted in Browser, Computer, CSS, Murmuring, Network, Programming, Security, Software, WWW | Leave a comment

PIXNET Album Expander

Posted on April 1, 2008 by Gea-Suan Lin

除了幫無名小站寫以外，也幫自己公司 (PIXNET) 寫 Album Expander，這樣我自己看圖片才方便 XD 這隻程式請配合 Greasemonkey 服用：PIXNET Album Expander。 另外在 trace DOM 的時候有一些感想，照片的部份全部都是 ul + li，再用 CSS 做出來的，當初設計這個 Template 的人不賴啊 XD Update：修正了兩個問題，第一個是 Google Code 今天一直噴 502 而讀不到 jQuery，所以只好用 code.jquery.com。第二個是修正相本 .thumgBox 與 .thumbImg span 裡設定 width/height 時會產生的 bug。

Posted in Computer, CSS, Murmuring, Network, Programming, WWW | 8 Comments

Opera 與 Webkit 相繼達成 Acid3 100% Pass 目標

Posted on March 27, 2008 by Gea-Suan Lin

Opera 與 Webkit 兩個 browser (engine) 已經先完成 Acid3 100% Pass： 看 Wikipedia 上的資料，這次 Opera 比 Webkit 快應該是為了報 Acid2 時的仇… (Acid2 由 Opera 的 CTO 所發表，但當時第一個達成 non-public build 100% pass 的卻是 Safari XDDD) Update：結果因為一個 bug 造成翻盤，參考 comment 裡 zmx 提供的 url。

Posted in Browser, Computer, CSS, Murmuring, Network, Opera, Safari, Software, WWW | 3 Comments

在 CSS 裡對於 Sub-Pixel 的計算方式

Posted on January 23, 2008 by Gea-Suan Lin

jQuery 的大魔頭 John Resig 在他的 blog 上討論了各瀏覽器對 Sub-Pixel 的處理方式：Sub-Pixel Problems in CSS。 在他文章裡，他產生了一個 50px 的 div，裡面包著四個 div，設定寬度為 “25%”，然後丟到 Opera 9、Safari 3、IE 6、IE 7、Firefox 3，以及 Firefox 2 裡測試。另外用 Javascript 去抓 DOM 裡面的寬度。這個問題也可以解釋為什麼某些站台的 Navigation Bar 在不同的瀏覽器下會有奇怪的「殘影」。

Posted in Browser, Computer, CSS, Firefox, IE, Murmuring, Network, Opera, Safari, Software, WWW | 1 Comment

IE8 通過 Acid2

Posted on December 20, 2007 by Gea-Suan Lin

IE8 內部測試版本已經通過 Acid2，一個很有名的 CSS 的測試了：Internet Explorer 8 and Acid2: A Milestone，接下來是時間的問題了，離 IE6 與 IE7 消失還有很長一段時間，不過畢竟總是要有個頭。 Firefox 3 會不會 delay 到成為最後一個支援 Acid2 的主流瀏覽器？(真的發生的話也不意外，只是會有很多人笑得很開心)

Posted in Browser, Computer, CSS, Firefox, IE, Murmuring, Network, Software, WWW | 8 Comments