MozTW 討論區
https://forum.moztw.org/

請問是否有stylish的教學？
https://forum.moztw.org/viewtopic.php?f=11&t=16467		 第 1 頁 (共 1 頁)
發表人:  Sheng [ 2006-11-16, 11:04 ]
文章主題 :  請問是否有stylish的教學？
如題，
討論區的東西有點難切入
wiki上好像也沒很多資訊
（我只是想要拿這東西檔廣告，因為adblock有它的極限）

謝謝
發表人:  bookmusic [ 2006-11-16, 19:28 ]
文章主題 : 
Sheng 寫:
（我只是想要拿這東西檔廣告，因為adblock有它的極限）
謝謝

我也不懂，我只會上 userstyles.org 找。

這是 Paulfox 寫的 Ad Blocking FiltersetP
發表人:  Milx [ 2006-11-16, 20:36 ]
文章主題 : 
Sheng 寫:
如題，
討論區的東西有點難切入
wiki上好像也沒很多資訊
（我只是想要拿這東西檔廣告，因為adblock有它的極限）

謝謝


你要先學會CSS
發表人:  bookmusic [ 2006-11-16, 23:59 ]
文章主題 : 
bookmusic 寫:
這是 Paulfox 寫的 Ad Blocking FiltersetP

對了，請問有誰還有舊版的 Ad Blocking FiltersetP ？作者在最近一次的更新中，把 Yahoo 的條件刪除了，這使得我在看 Yahoo 首頁時，以前會擋掉的一些文字廣告，現在又都出現了。

引言回覆:
Thanks to Flight23 for the Yahoo Finance info; all "yimg" refs removed. This will cause people to see a lot more ads on Yahoo, but there are separate Yahoo scripts they can look at. I'm tired of dealing with them.
發表人:  arphen [ 2006-11-17, 15:45 ]
文章主題 : 
Stylish 讓 user 以自訂 CSS 的方式來達到改變網頁樣貌的目的，常見的應用如：改變字型、改變字體大小粗細、改變顏色、隱藏某些內容(如廣告)等。

因此，user 首先要學會使用 CSS 語法。

學習 CSS 最重要必須掌握二個關鍵 - What & How?
What 指的是操作的對象為何? How 指的是想要它有什麼表現。

例如想隱藏網頁上的某張圖片，則該圖片就是我們的操作對象(What)；我們要圖片不顯示，即 How。

下面是一個 CSS 範例，其中 #imgId 就是 What，括號內所指動作即 How。
代碼:
#imgId
{
   display: none !important;
}


把握住上述二個關鍵後，幾乎所有 CSS 語法就是要先指出 What，再告訴它 How。只要練習幾次，就能得心應手。

那麼，CSS 要如何指定 What 呢?

個人認為這是最重要的步驟，因為不知如何選出操作對象，其它動作就免談。

在 CSS 裡有個工具叫 selector，顧名思義是讓我們選東西用的。也就是說，我們可透過適當的 selectors 把操作對象給挑出來。
Selector 的用法大家一定要先搞清楚，必要時記下來，使用時會更得心應手。

以下是 selectors 的參考網址，注意 Fx 尚未支援所有語法，實測是最好的驗證方式。
http://www.w3.org/TR/css3-selectors/

Selector 分為以下幾大類，我在前面標註使用頻率及學習難度(僅供參考)：

* Universal selector: (常用/簡單) 用於選取所有物件，例如：* (星號)

* Type selectors: (常用/簡單) 用於選取 html 語法的某種 tag 物件，例如：img (選取所有圖片)

* Class selectors: (常用/簡單) 用於選取屬於某種類別的物件，例如：.myClass (一點，再加上類別名稱myClass)

* ID selectors: (常用/簡單) 以id來指定物件，例如：#myID (井號，再加上代號myID)

* Attribute selectors: (少用/普通) 用於選取(不)具某種屬性的物件，例如：img[width="100"] (選取寬為100的圖片)

* Pseudo-classes: (少用/較難) 這種 selector 不建議初學者嘗試，如果前面幾種都學會了，自己再來鑽研吧！

下面是所有 selectors 的速查表：
http://www.w3.org/TR/css3-selectors/#selectors

學會各種 selectors 後，再加上各種排列組合，幾乎可以挑出所有想操弄的對象。
當然，仍有少數頑劣份子無法以現有 selectors 取出，這有賴日後 CSS 規格的修訂以瀏覽器的配合。

寫到這裡，照理應往下繼續寫 How 的部份。但我認為如果各位看到這裡都還跟得上，下面也不需多說了，網路上 CSS 隨手可得，以各位目前的功力，自己觀摩應綽綽有餘。

輔助工具

倒是想再分享一下使用Stylish的心得，承如前面所言，選取對象是我覺得最困難的部份，目前來說，Stylish並未提供任何可以幫助user的自動化工具。因此，必須藉助於其它工具。

我建議 FireBug 這個 Addon，它的 Inspect 功能讓user可以用滑鼠點選網頁的任何看得到的物件，選取後可以觀察它的詳細資訊，包括：html tag, id, class, attributes, ...有了這些資訊，配合 CSS selectors 就可以大顯身手了。

另外 Firefox 內建的 DOM Inspector 也可以，不過我覺得它不太適合初學者。

更進一步

如果說 Stylish 讓 user 改變網頁樣貌，那麼 Greasemonkey 就是讓 user 改變網頁的行為。

當你成為 Stylish 的重度使用者後，你會發現 CSS 無法滿足你所有需求，建議可以朝 Greasemonkey 發展。

Demo

http://aiddlywiki.sourceforge.net/tmp/stylish/index.html
發表人:  szany [ 2006-11-17, 16:43 ]
文章主題 : 
arphen 寫:
輔助工具

倒是想再分享一下使用Stylish的心得，承如前面所言，選取對象是我覺得最困難的部份，目前來說，Stylish並未提供任何可以幫助user的自動化工具。因此，必須藉助於其它工具。

我建議 FireBug 這個 Addon，它的 Inspect 功能讓user可以用滑鼠點選網頁的任何看得到的物件，選取後可以觀察它的詳細資訊，包括：html tag, id, class, attributes, ...有了這些資訊，配合 CSS selectors 就可以大顯身手了。

另外 Firefox 內建的 DOM Inspector 也可以，不過我覺得它不太適合初學者。



其實把 Web Developer 也裝上去吧，很好用的
ctrl+shift+F 鍵，可以讓你隨時看想改的地方呢...
發表人:  arphen [ 2006-11-17, 17:49 ]
文章主題 : 
szany 寫:
其實把 Web Developer 也裝上去吧，很好用的
ctrl+shift+F 鍵，可以讓你隨時看想改的地方呢...


可惜無法定格，滑鼠移走內容就不見了。
發表人:  aaronwang [ 2006-11-21, 16:36 ]
文章主題 : 
szany 寫:
arphen 寫:
輔助工具

倒是想再分享一下使用Stylish的心得，承如前面所言，選取對象是我覺得最困難的部份，目前來說，Stylish並未提供任何可以幫助user的自動化工具。因此，必須藉助於其它工具。

我建議 FireBug 這個 Addon，它的 Inspect 功能讓user可以用滑鼠點選網頁的任何看得到的物件，選取後可以觀察它的詳細資訊，包括：html tag, id, class, attributes, ...有了這些資訊，配合 CSS selectors 就可以大顯身手了。

另外 Firefox 內建的 DOM Inspector 也可以，不過我覺得它不太適合初學者。



其實把 Web Developer 也裝上去吧，很好用的
ctrl+shift+F 鍵，可以讓你隨時看想改的地方呢...


我的 Web Developer 裝了好久～
現在才知道有這這麼方便的功能.... Orz :shock: :shock: :shock:
發表人:  AlanLive [ 2006-11-21, 19:32 ]
文章主題 : 
bookmusic 寫:
Sheng 寫:
（我只是想要拿這東西檔廣告，因為adblock有它的極限）
謝謝

我也不懂，我只會上 userstyles.org 找。

這是 Paulfox 寫的 Ad Blocking FiltersetP


請問可以說明一下 Ad Blocking FiltersetP 的功能嗎？謝謝
發表人:  Sheng [ 2006-11-21, 19:54 ]
文章主題 : 
AlanLive 寫:
bookmusic 寫:
Sheng 寫:
（我只是想要拿這東西檔廣告，因為adblock有它的極限）
謝謝

我也不懂，我只會上 userstyles.org 找。

這是 Paulfox 寫的 Ad Blocking FiltersetP


請問可以說明一下 Ad Blocking FiltersetP 的功能嗎？謝謝


首段提到:
This is FiltersetP without the AdBlock extension, lean, mean and complete as possible.

安裝方法
Installing styles from this site is as easy as a pressing the "Load into Stylish" button on a style's page when you have Stylish installed.
發表人:  AlanLive [ 2006-11-21, 22:39 ]
文章主題 : 
Sheng 寫:
AlanLive 寫:
bookmusic 寫:
Sheng 寫:
（我只是想要拿這東西檔廣告，因為adblock有它的極限）
謝謝

我也不懂，我只會上 userstyles.org 找。

這是 Paulfox 寫的 Ad Blocking FiltersetP


請問可以說明一下 Ad Blocking FiltersetP 的功能嗎？謝謝


首段提到:
This is FiltersetP without the AdBlock extension, lean, mean and complete as possible.

安裝方法
Installing styles from this site is as easy as a pressing the "Load into Stylish" button on a style's page when you have Stylish installed.


那再請問如果我有裝 AdBlock Plus 這個套件，再用這個語法，效果會比較好嗎？還是有可能相衝？不吝賜教，謝謝
發表人:  bookmusic [ 2006-11-21, 23:27 ]
文章主題 : 
AlanLive 寫:
那再請問如果我有裝 AdBlock Plus 這個套件，再用這個語法，效果會比較好嗎？還是有可能相衝？不吝賜教，謝謝


你可以像我

1. AdBlock Plus+ AdBlock Filterset.G Updater
2. Stylish + Ad Blocking FiltersetP
3. Remove it Permanently
4. CustomizeGoogle （拿來刪掉 Google 搜尋時右側的廣告 ）

四者全用，沒有相衝， Fx 跑得好好的；功能相衝了我知道，但我實在不想看到任何廣告，所以就索性全都使用了 :D
發表人:  Sheng [ 2006-11-22, 01:11 ]
文章主題 : 
AlanLive 寫:
那再請問如果我有裝 AdBlock Plus 這個套件，再用這個語法，效果會比較好嗎？還是有可能相衝？不吝賜教，謝謝

要看你的「效果」是指什麼
基本上filter和extension越多效能會越差吧
（也可能只是無感的差異，因人而異吧）
當然擋掉的東西和你寫進去的濾鏡量成正比

只是使用filtersetP以前記得看看作者的聲明
（想起史帝芬金試圖在網路上連載小說的故事…）
第 1 頁 (共 1 頁) 所有顯示的時間為 UTC + 8 小時
Powered by phpBB® Forum Software © phpBB Group
https://www.phpbb.com/