小屋創作

日誌2018-11-16 11:18

【Stylus】Stylus工具簡介

作者：羽翼

有以下需求的人會愛上的工具：
1. 要閱讀大量文字，希望對比低一點
2. 想要一個整體色較亮(or暗)，但網頁沒有提供其他樣式供切換
3. 覺得網頁的css不夠順眼

(如果是要彈出視窗，或者是自動OOO，有別款能inject JS的工具，只是就不在這篇的討論範圍)

●安裝方法 (Chrome)
1. 到「chrome 線上應用程式商店」搜尋「Stylus」，大概第一個就是了 (或點此連結 )
2. 點「加到Chrome」的按鈕就OK了，chrome的右上角應該會出現一個寫著S的天青色方塊

●使用方法
這邊用比較省事的方法來舉例
1. 進到預計要修正格式的網站
2. 點Stylus的方塊，再點「編寫樣式給：(一段網址)」，就會另開編輯用的分頁
3. (大致上維持預設就行了，如有需要再進一部參考官網說明：http://stylus-lang.com/)
4. 書寫CSS。利用css有先後順序來取代格式，如果遇到important或優先度更高的，style就會上不去。
5. 別忘記「儲存」，也可使用組合鍵「Ctrl + S」

●碎碎念
　　至於不會寫... 可以Copy別人的，或是到Stylish上去摳來用，大致上差不多。

　　原本我是使用 Stylish (https://userstyles.org/) ，撰寫的style也能上傳到平台供他人使用(比如說弄了個plurk的dark theme)，只是在stylish某次違反google使用合約後，就被chorme下架了 (被攔截到擅自收集使用者正在瀏覽的網頁資料，雖然宣稱是提供更好的使用者體驗，但stylish背後的公司是販售marketing數據的，明眼人大概能理解這意思)，至於後來有沒有修正... 我就沒注意了，就算修正也有可能哪天又偷偷來。
　　於是就轉用他的前身 Stylus，他是opensource, 隨時能檢驗程式碼內容。
由於70%上一致，並沒有很痛的適應期，不過功能是相對簡單不少 ─ 對我而言是好事，這代表不會很笨重。

2

3

LINE 分享

相關創作

2024 的個人網頁設計

火狐Firefox CSS樣式：美化套件管理按鈕

火狐Firefox CSS樣式：套件管理員美化

留言

開啟 APP

face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準，可能無法使用新的應用程式來呈現網站內容，在瀏覽器支援度及網站安全性的雙重考量下，為了讓巴友們有更好的使用體驗，巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特：
。Google Chrome（推薦）
。Mozilla Firefox
。Microsoft Edge（Windows10以上的作業系統版本才可使用）

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營，請將 gamer.com.tw 加入廣告阻擋工具的白名單中，謝謝 !【教學】