Stylus插件定制自己的專屬網(wǎng)頁(yè)樣式

俞木發(fā)

1安裝Stylus插件

打開“https：//github.com/openstyles/stylus”鏈接下載它的最新版。安裝完后點(diǎn)擊新Edge狀態(tài)欄中的“S”圖標(biāo)啟動(dòng)插件，在左側(cè)的窗格中可以管理樣式，包含查看已安裝的樣式、導(dǎo)出樣式、導(dǎo)入樣式、獲取樣式、更新樣式等功能（圖1）。

2下載樣式

St ylus插件本身并沒有自帶樣式，大家可以根據(jù)自己的實(shí)際需要下載其他網(wǎng)友制作好的樣式文件。在新Edge中打開“https：//userstyles.world/”鏈接，在搜索框中輸入所需樣式的關(guān)鍵詞，比如經(jīng)常使用百度搜索的朋友可以輸入“baidu”，然后點(diǎn)擊搜索結(jié)果中的“簡(jiǎn)百度”（圖2）。接著在打開的頁(yè)面中點(diǎn)擊“安裝”，在自動(dòng)打開的Stylus插件窗口中點(diǎn)擊“安裝樣式”，當(dāng)出現(xiàn)“樣式安裝完成”的提示后就可以在百度搜索中使用它了（圖3）。

3使用樣式

為了方便查看應(yīng)用樣式前后的對(duì)比效果，先在圖1所示的界面中點(diǎn)擊“S”圖標(biāo)，去除“簡(jiǎn)百度”樣式的勾選（即暫時(shí)不使用此樣式）。然后打開百度搜索并輸入關(guān)鍵詞“電腦”，在搜索結(jié)果頁(yè)面中可以看到廣告、熱門游戲推薦、相關(guān)電子電器產(chǎn)品、百度熱搜等內(nèi)容（圖4）。

接下來(lái)啟用“簡(jiǎn)百度”樣式，然后按下F5鍵刷新搜索結(jié)果頁(yè)面，可以看到上述的廣告、熱門游戲推薦、熱搜等內(nèi)容被自動(dòng)屏蔽了，這就是“簡(jiǎn)百度”的樣式效果（圖5）。這樣的頁(yè)面瀏覽起來(lái)是不是更清爽了呢？

4編輯樣式

除了直接使用樣式默認(rèn)設(shè)置好的功能外，我們還可以根據(jù)自己的實(shí)際需求對(duì)樣式進(jìn)行更多設(shè)置。

一種方法是使用樣式內(nèi)置的配置選項(xiàng)。比如可以先到“https：//userstyles.org/”鏈接下載并使用“百度輕”樣式，然后打開百度搜索頁(yè)面，點(diǎn)擊樣式圖標(biāo)上方的“通過userstyles.org配置選項(xiàng)”，在打開的窗口中就可以設(shè)置是否屏蔽推廣鏈接、是否去除登錄按鈕、模式切換、設(shè)置網(wǎng)頁(yè)背景等選項(xiàng)了（圖6）。

另一種方法是自行修改樣式代碼，在原來(lái)樣式的基礎(chǔ)上手動(dòng)編輯代碼擴(kuò)展自己需要的功能。比如為了避免孩子在嗶哩嗶哩觀看直播節(jié)目時(shí)給主播打賞，可以屏蔽直播界面中的“禮物欄”。先打開“https：//userstyles.world/”鏈接搜索并安裝“bilibili lte”樣式，接著打開圖1所示的界面，在右側(cè)窗格的樣式欄中選擇“bilibili lte”樣式，在打開的代碼窗口中定位到最下方，輸入如下代碼（JavaScript代碼），然后點(diǎn)擊左側(cè)窗格中的“保存”按鈕（圖7）：

/* 屏蔽禮物欄 */

.gift-control-section{

display：none;

這樣孩子在新Edge中訪問嗶哩嗶哩的直播頁(yè)面時(shí)，在播放界面的下方就看不到“禮物欄”了，同時(shí)樣式自帶的功能還會(huì)自動(dòng)屏蔽廣告鏈接、彈幕、聊天對(duì)話框等內(nèi)容（圖8）。