2010年1月3日

[Fx套件] Stylish-擁有與眾不同的網站版面

此篇為點圖放大文章
套件資訊:
Stylish是一個讓使用者可以自訂網站與使用介面外觀的附加套件,是我相當推薦安裝的套件之一,使用方法可以參考底下相關閱讀連結,以下就個人推薦的樣式介紹給各位:(以下圖片可點選放大)

1.OS X Style for New Google Reader 
Google+Reader-Stylish.jpg
適用於中英文版Google Reader,惟在中文版時,左上方的Google Reader標題會被裁切一小部份,但並不會影響到整體畫面,另外可在搭配New Spinner for Google Reader,以增加讀取時的美觀。

2.YouTube.com - dark gray redesign (vC)
Youtube-stylish.jpg
把YouTube網站從原本的白色系改變成灰黑色系,增加瀏覽上的美觀及減少眼睛的負擔。

3.Gmail Cleaner and Tweaker
由台灣Nelson為Gmail所製作的樣式,其網誌有相當詳盡的說明,故不在截圖介紹。
[FX] 給 Gmail 用的 Stylish @ Nelson 國三生了沒 

4.Website: cleaner - WRETCH - Album
看名稱即知,這是給無名相簿使用,同為Nelson所製作的樣式。
[FX] 給無名相簿用的 Stylish @ Nelson 國三生了沒 

5. Auto-Hide BookMarks Toolbar - Firefox 3.0 *FIXED*  
隱藏Firefox書籤列,增大瀏覽空間,當滑鼠移過去書籤列會自動顯示出來。

6.Yellow https location bar
之前Firefox 3.0版,在連到https://加密網址時,網址列會顯示為黃色底色,以突顯與一般網址不同,然而到3.5版後,Firefox卻取消這功能,用鎖頭取代,此樣式可恢復原本黃色底色的功能,惟須注意,部分佈景主題與此樣式不相容,有溢位或失效的情形產生。

7.Combine Stop/Reload buttons
合併Firefox的停止及重新讀取按鈕。

注意:倘若遇到無法隱藏狀況,請先「自訂」工具列,把 Stop Button 移到 Reload Button 的左邊(安裝網址有圖示說明)。


以下為自行手動撰寫的樣式,煩請自行複製下列語法並儲存:
(PS.下列是之前從網路上看來並儲存在我的電腦中,但我已忘記各個來源連結,倘若有人知道,請告知我,以補上相關連結) 

1.Google Reader 字體
@-moz-document url-prefix("https://www.google.com/reader") ,url-prefix("http://www.google.com/reader")
{
.entry .entry-body {max-width:100% !important; font-size:16px !important; line-height:150% !important;}
}

更改前:
GR+word+be-Stylish.jpg
更改後:
GR+word+af+-+Stylish.jpg
原本的Google Reader字體過小不易閱讀,經更改後,字體放大變得相當容易閱讀瀏覽。

2.網站大圖縮小(適用於朱學恆的阿宅萬事通事務所)
@-moz-document url-prefix("http://blogs.myoops.org/lucifer.php")
{
img {
max-width: 100% !important;
height: 100% !important;
}
}

以上語法是針對朱學恆的阿宅萬事通事務所所設定,如果要適用別的網站,請把第一行的網址更改為你要的網站網址並將標式紅色的語法刪去。

3.圖片失連圖示
@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document url-prefix(http), url-prefix(file) {
img:-moz-broken{
-moz-force-broken-image-icon:1;
width:24px;
height:24px;
}
}

在使用IE時,當圖片失連會用一個紅色的X圖示(俗稱叉燒包XD)替代,但是在同樣的情況,Firefox卻是空白的一片,此語法就是此失連的圖片用替代圖示顯示出來。

相關閱讀:
Stylish:看著不爽?隨手換掉網站的閱讀版面與視覺效果 | 電腦玩物
17個讓Gmail更華麗、更好用的「Stylish佈景主題」 (Firefox外掛)| 重灌狂人

沒有留言:

張貼留言