改造你的瀏覽器系列之美化網(wǎng)頁插件Stylus
時間：2023-07-02 11:54:01 | 來源：網(wǎng)站運營
時間：2023-07-02 11:54:01 來源：網(wǎng)站運營
改造你的瀏覽器系列之美化網(wǎng)頁插件Stylus：[TOC]
前言
這一系列的上一篇文章介紹了瀏覽器萬能插件——油猴，點擊查看，這一篇文章介紹它的好基友——Stylus。Stylus 的作用就一個，
讓你自定義瀏覽網(wǎng)頁的樣子。比如說百度貼吧可以變得整整齊齊、毫無廣告推廣內(nèi)容，百度搜索可以工工整整、沒有競價排名的推廣搜索結(jié)果，還比如說新浪微博頁面可以隱藏淘寶鏈接、推廣微博，其他本站、油管（Youtube）、Instagram 頁面都有很好的效果，你可以按照自己的需求找到最適合自己的頁面樣式，這對于重視瀏覽體驗的博主我來說是必不可少的瀏覽器插件。 以大家每天都會用的百度為例，圖一圖二是博主沒用 Stylus 的截圖，圖三圖四是用了的截圖。
Stylus 的原理很簡單，就是自定義瀏覽網(wǎng)頁的樣式表，CSS。通過它，我們就可以將過時的網(wǎng)頁進(jìn)行美化，去除網(wǎng)頁的廣告了。
而作為用戶，我們只需要下載別人做好的樣式就行，不需要掌握 CSS。 其實博主最開始用的不是 Stylus，而是 Stylish 這款插件。但 Stylish 被查出，它會追蹤用戶瀏覽過的所有站點，并將它們傳送到遠(yuǎn)程服務(wù)器，同時還會默認(rèn)記錄用戶的搜索結(jié)果、頁面識別符，在很多情況中這可以關(guān)聯(lián)到用戶的郵件或者其他隱私內(nèi)容，這在重視隱私的社會是無法被原諒的，因此已經(jīng)被 Google Chrome、Mozilla Firefox、Opera 瀏覽器下架。 而博主現(xiàn)在正在用的 Stylus 與 Stylish 相比，它任何和分析，遙測和數(shù)據(jù)收集的代碼已被完全刪除，所以我們完全不用擔(dān)心我們的隱私被泄露。而且，Stylus 做了進(jìn)一步改進(jìn)：
- 增加了備份功能。不僅可以導(dǎo)出壓縮文件，還可以通過加載別人的壓縮文件，從而快速安裝樣式，對新人來說很友好。
- 自動更新。第一時間獲取樣式的最新版本。
我喜歡 Stylus 的另一個原因是，我不但可以下載別人做好的樣式，我還可以通過插件的內(nèi)置編輯器，用 CSS 自定義網(wǎng)頁的樣式。這就給了我很大的自由，如果樣式網(wǎng)站里面沒有我想要的，或者我不太喜歡，我就可以自己定義一個。CSS 的語法特別簡單，如果想學(xué)習(xí)，可以點擊菜鳥教程。
Stylus 安裝及使用
在瀏覽器的插件商店里面下載安裝即可，支持各種常見的瀏覽器，在這里不做詳細(xì)的介紹。 插件安裝好后，就可以安裝樣式了，安裝樣式主要有兩個方法：
- 去 Stylish 的樣式網(wǎng)站下載安裝（雖然插件下架，但這些樣式并沒有任何問題，可以放心使用），地址。這種方法適合一次性下載多個樣式表。
- 點擊菜單欄上的 Stylus 按鈕，它會顯示當(dāng)前網(wǎng)頁可用的樣式。
樣式推薦
這里推薦一些大家平常常用的，在本文最后，博主分享了自己正在使用的一些樣式，下載后可以方便的導(dǎo)入到自己的插件里。 就不一一展示美化結(jié)果了，點擊下表的鏈接就可以轉(zhuǎn)到樣式的主頁，查看最終效果。
百度系
| 樣式名字 | 鏈接 | | :----------------------------------------------------------: | :------------------------------------------------------: | | Baidu Lite 百度輕 |
https://userstyles.org/styles/123858/baidu-lite | | BaiduX 極簡百度 + 動態(tài)多欄 + 去下劃線 + 毛玻璃導(dǎo)航欄 + 關(guān)鍵詞高亮 |
https://userstyles.org/styles/158871/baidux | | 百度經(jīng)驗 - 屏蔽和優(yōu)化 |
https://userstyles.org/styles/132605/theme | | 百度知道 - 屏蔽與排版 |
https://userstyles.org/styles/130901/theme | | 百度百科 - 屏蔽和優(yōu)化 |
https://userstyles.org/styles/130739/theme | | 百度文庫 - 屏蔽 |
https://userstyles.org/styles/135468/theme | | Tieba - Maverick 2018 [百度貼吧] |
https://userstyles.org/styles/124770/tieba-maverick-2018 | | 百度網(wǎng)盤 - 屏蔽和優(yōu)化 |
https://userstyles.org/styles/157025/theme |
優(yōu)酷
| 樣式名字 | 鏈接 | | :----------------------------------: | :----------------------------------------------------------: | | No Ads -
http://Youku.com |
https://userstyles.org/styles/156467/no-ads-youku-com | | 優(yōu)酷網(wǎng) - Dark 加強(qiáng)版 |
https://userstyles.org/styles/75931/dark | | 優(yōu)酷顯示狀態(tài)欄 |
https://userstyles.org/styles/138501/theme | | YouKu Cleaner,ad block for
http://Youku.com |
https://userstyles.org/styles/21446/youku-cleaner-ad-block-for-youku-com | | YOUKU ++=>1080P |
https://userstyles.org/styles/51198/youku-1080p |
淘寶
| 樣式名字 | 鏈接 | | :----------: | :----------------------------------------: | | 純凈版 淘寶 |
https://userstyles.org/styles/168403/theme | | Taobao XX | 淘寶助手 | | Taobao clean | 干凈淘寶 1.5.2 |
豆瓣
| 樣式名字 | 鏈接 | | :------------: | :----------------------------------------: | | 豆瓣簡潔圓角 |
https://userstyles.org/styles/98519/theme | | 更好的豆瓣廣播 |
https://userstyles.org/styles/136772/theme |
嗶哩嗶哩
樣式名字 |鏈接 | | :------------: | :------------: | |Bilibili 屏蔽廣告 & 首頁去除 舞蹈、生活、時尚、娛樂…… 分類區(qū)塊|
https://userstyles.org/styles/144506/bilibili| |Bilibili 去除 彈幕、評論|
https://userstyles.org/styles/144507/bilibili| |Bilibili 嗶哩嗶哩 Nekopara|
https://userstyles.org/styles/136957/bilibili-nekopara|
本站
| 樣式名字 | 鏈接 | | :-----------------------------------------------------: | :-----------------------------------------------------: | | Simple Zhihu |
https://userstyles.org/styles/142714/simple-zhihu | | Flat_Zhihu v2.4.13 |
https://userstyles.org/styles/108011/flat-zhihu-v2-4-13 | | ZhihuX 極簡本站 + 寬屏適配 + 毛玻璃 + 導(dǎo)航條自動隱藏 V2 |
https://userstyles.org/styles/159687/zhihux-v2 |
說明
每個人的需求不一樣，所以你在上面的表格里面沒有發(fā)現(xiàn)你需要樣式也沒關(guān)系，只要去樣式官網(wǎng)或者點擊瀏覽器菜單欄 Stylus 的按鈕即可。
大殺器
對樣式官網(wǎng)上的樣式不滿意，想自己做一個，那也很簡單。點擊瀏覽器菜單欄 Stylus 按鈕，點擊
編輯樣式給當(dāng)前網(wǎng)頁，即可看到下面頁面。
只要掌握一點點 CSS 的基礎(chǔ)知識，你就可以在網(wǎng)頁里面添加或者刪除任何你想要的東西。 其實，如果你學(xué)過本站的 MarkDown 系列教程，就知道 HTML 了，學(xué)過上一篇的油猴插件，你就知道 JavaScript 了，加上本篇文章了解的 CSS，你已經(jīng)了解了制作網(wǎng)頁的前端三件套了，也就是說，你只要稍微再學(xué)一學(xué)，你就可以像博主一樣制作網(wǎng)頁了。其實，制作網(wǎng)頁沒有你們想象的那么難，再加上博主的準(zhǔn)備暑假寫關(guān)于建站的文章，相信你在不就的將來也可以像博主一樣擁有自己的網(wǎng)站了。
總結(jié)
油猴 + Stylus，讓你做你瀏覽器的主人。 鏈接:
https://pan.baidu.com/s/1kU4L26cm1rjutxuoupifBw 提取碼: ykmq。雖然只有500+Kb大小，但是以百度網(wǎng)盤的速度還是要點時間，可以查看本站熱門文章，百度網(wǎng)盤滿速下載工具集合。
預(yù)告
本系列下一篇文章準(zhǔn)備介紹其他有用好玩的瀏覽器插件。如果你覺得本站的文章對你有很大的幫助，記得向你的朋友轉(zhuǎn)發(fā)喔。如果對本站或者本篇文章有什么建議或者疑惑，可以在下面評論留言，博主會第一時間回復(fù)。如果想第一時間知道本站最新動態(tài)，歡迎大家郵件訂閱本站，訂閱按鈕在評論區(qū)，一定要評論后才能訂閱喔。
在線咨詢
