則進(jìn)階：Adaptive Tab Bar Colour 的 URL、正則與通配符寫法完全解析)
匹配規(guī)則進(jìn)階Adaptive Tab Bar Colour 的 URL、正則與通配符寫法完全解析【免費下載鏈接】Adaptive-Tab-Bar-ColourChanges the colour of Firefox theme to match the website’s appearance.項目地址: https://gitcode.com/gh_mirrors/ad/Adaptive-Tab-Bar-ColourAdaptive Tab Bar ColourATBC是一款讓 Firefox 標(biāo)簽欄、工具欄和側(cè)邊欄自動跟隨網(wǎng)站配色變色的擴展。默認(rèn)情況下它全自動工作但如果你希望某些網(wǎng)站永遠(yuǎn)使用指定顏色、忽略網(wǎng)站的 theme-color甚至從頁面上某個元素取色就需要掌握它的「匹配規(guī)則」寫法。本文面向新手用最直白的語言拆解 ATBC 匹配規(guī)則的四種寫法URL、域名、通配符與正則并附上可直接套用的實戰(zhàn)案例。 簡單說規(guī)則 匹配誰URL 怎么寫做什么選顏色/用主題色/取元素色何時生效明/暗/雙模式。本文只講最難的部分——匹配誰。一、規(guī)則在哪里設(shè)置打開擴展的選項頁切到Rule list規(guī)則列表標(biāo)簽頁即可看到規(guī)則卡片。輸入框的占位提示原文是URL/regex/wildcard/domain也就是說 ATBC 支持四種匹配寫法對應(yīng)代碼位于 preference.ts 的getRule方法中按順序執(zhí)行先試完整 URL 精確匹配再試正則接著是通配符最后是域名匹配命中即生效。每條規(guī)則還有三個附加屬性屬性可選值含義typeCOLOUR / THEME_COLOUR / QUERY_SELECTOR指定顏色 / 使用或忽略網(wǎng)站主題色 / 從元素取色schemeboth / light / dark明暗雙模式 / 僅淺色 / 僅深色headerTypeURL / ADDON_ID按網(wǎng)址匹配 / 按擴展 ID 匹配二、四種匹配寫法逐一拆解1. 完整 URL最精確的匹配規(guī)則寫法直接粘貼完整網(wǎng)址即可例如https://example.com/blog/articlehttp://example.com需要注意ATBC 比較時會忽略末尾斜杠所以https://example.com/和https://example.com等價。缺點是只要 URL 里多一個參數(shù)、少一個目錄就匹配不上適合只針對單篇文章、單個頁面的場景。2. 域名匹配最常用的 Firefox 標(biāo)簽欄顏色規(guī)則這是大多數(shù)人的首選寫法就是不帶協(xié)議的域名可帶可選的路徑example.comexample.com/blog它最大的好處是自動覆蓋所有子域名寫example.com那么www.example.com、mail.example.com都能命中。協(xié)議https://、http://寫不寫都行帶路徑時則要求路徑前綴一致example.com/blog能匹配example.com/blog/post。3. 通配符寫法*、**與?的規(guī)則這是新手最容易踩坑的地方ATBC 的通配符規(guī)則如下符號含義注意事項**匹配任意長度的任意字符包括/、.、:*匹配任意字符但不匹配/、.、:?匹配任意單個字符一個?只占一個位置舉幾個例子幫助理解https://*.example.com—— 注意*不匹配.所以這里的*只能替代一個子域名段如news.example.com但匹配不了a.b.example.comhttps://**.example.com—— 換成**就能匹配任意層級的子域名https://example.com/path/*—— 匹配path/下一層任意內(nèi)容但*不跨/所以到path/a/b就失效example.com/????—— 匹配任意 4 個字符組成的路徑段另外協(xié)議前綴是可選的寫*.example.com與https://*.example.com等效。4. 正則表達(dá)式進(jìn)階用戶的終極武器ATBC 會把你輸入的內(nèi)容當(dāng)作正則處理并且自動加上^和$錨點即必須從頭到尾完全匹配同時不區(qū)分大小寫。常見的實用寫法.*\.example\.com—— 匹配 example.com 及其所有子域名含多級https://.*\.example\.com/.*—— 限定 https 協(xié)議并帶任意路徑example\.(com|org|net)—— 匹配多個頂級域名 如果正則寫錯語法無效這條規(guī)則會被靜默忽略所以寫完后務(wù)必測試。三、規(guī)則優(yōu)先級后寫的規(guī)則說了算ATBC 會從上到下遍歷整張規(guī)則列表后面的匹配結(jié)果會覆蓋前面的。舉例先寫了一條example.com指定紅色再寫一條news.example.com指定藍(lán)色那么訪問news.example.com時用的是藍(lán)色。建議把「范圍大、通用性強」的規(guī)則放前面把「范圍小、特例」的規(guī)則放后面形成一個「默認(rèn) → 特例」的層級。四、三種「做什么」給匹配加上動作匹配寫法只是「瞄準(zhǔn)」還需要告訴 ATBC「開火」specify a colour指定顏色直接給該網(wǎng)站指定一個固定顏色這是最常見的用法use/ignore theme color使用/忽略主題色強制使用網(wǎng)站提供的 theme-color或反過來忽略它全局忽略在高級設(shè)置里也能開pick colour from element從元素取色輸入 CSS 選擇器例如header、.hero-banner、#logoATBC 會讀取該元素顏色作為標(biāo)簽欄顏色元素找不到時會回退到頁面取色 順帶一提如果你只想快速給「當(dāng)前網(wǎng)站」加一條規(guī)則直接在擴展彈窗里點Add a new ruleATBC 會自動用當(dāng)前域名生成一條規(guī)則見 RuleWidget.tsx再手動微調(diào)即可。五、實戰(zhàn)速查表照著抄就行需求匹配寫法header 一欄整個網(wǎng)站用指定顏色example.com某子域名用指定顏色mail.example.com網(wǎng)站 所有層級子域名**.example.com單個文章頁https://example.com/blog/2024/01/01某目錄下所有頁面example.com/docs多個域名共用一條規(guī)則.*\.(example|test)\.com只想管深色模式寫法不變把 scheme 切到 dark六、常見問題排查清單規(guī)則沒生效先確認(rèn) scheme 是否與當(dāng)前明暗模式匹配再確認(rèn)前面有沒有更靠后的規(guī)則覆蓋了它*匹配不到帶/的路徑這是正常的路徑用**或直接寫完整 URL輸入框標(biāo)紅提示「This rule will be ignored」說明寫法無法被識別檢查正則是否合法、通配符是否放錯位置規(guī)則只在部分頁面生效Firefox 的受保護頁面如about:頁、擴展頁面不參與匹配這是瀏覽器的安全限制掌握以上四種寫法你就能把 ATBC 從「全自動傻瓜模式」升級成「指哪打哪的精準(zhǔn)模式」——既能讓所有網(wǎng)站自動跟隨配色又能為個別網(wǎng)站定制專屬的 Firefox 標(biāo)簽欄顏色?？烊ミx項頁試試吧【免費下載鏈接】Adaptive-Tab-Bar-ColourChanges the colour of Firefox theme to match the website’s appearance.項目地址: https://gitcode.com/gh_mirrors/ad/Adaptive-Tab-Bar-Colour創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考 匹配規(guī)則進(jìn)階：Adaptive Tab Bar Colour 的 URL、正則與通配符寫法完全解析
匹配規(guī)則進(jìn)階Adaptive Tab Bar Colour 的 URL、正則與通配符寫法完全解析【免費下載鏈接】Adaptive-Tab-Bar-ColourChanges the colour of Firefox theme to match the website’s appearance.項目地址: https://gitcode.com/gh_mirrors/ad/Adaptive-Tab-Bar-ColourAdaptive Tab Bar ColourATBC是一款讓 Firefox 標(biāo)簽欄、工具欄和側(cè)邊欄自動跟隨網(wǎng)站配色變色的擴展。默認(rèn)情況下它全自動工作但如果你希望某些網(wǎng)站永遠(yuǎn)使用指定顏色、忽略網(wǎng)站的 theme-color甚至從頁面上某個元素取色就需要掌握它的「匹配規(guī)則」寫法。本文面向新手用最直白的語言拆解 ATBC 匹配規(guī)則的四種寫法URL、域名、通配符與正則并附上可直接套用的實戰(zhàn)案例。 簡單說規(guī)則 匹配誰URL 怎么寫做什么選顏色/用主題色/取元素色何時生效明/暗/雙模式。本文只講最難的部分——匹配誰。一、規(guī)則在哪里設(shè)置打開擴展的選項頁切到Rule list規(guī)則列表標(biāo)簽頁即可看到規(guī)則卡片。輸入框的占位提示原文是URL/regex/wildcard/domain也就是說 ATBC 支持四種匹配寫法對應(yīng)代碼位于 preference.ts 的getRule方法中按順序執(zhí)行先試完整 URL 精確匹配再試正則接著是通配符最后是域名匹配命中即生效。每條規(guī)則還有三個附加屬性屬性可選值含義typeCOLOUR / THEME_COLOUR / QUERY_SELECTOR指定顏色 / 使用或忽略網(wǎng)站主題色 / 從元素取色schemeboth / light / dark明暗雙模式 / 僅淺色 / 僅深色headerTypeURL / ADDON_ID按網(wǎng)址匹配 / 按擴展 ID 匹配二、四種匹配寫法逐一拆解1. 完整 URL最精確的匹配規(guī)則寫法直接粘貼完整網(wǎng)址即可例如https://example.com/blog/articlehttp://example.com需要注意ATBC 比較時會忽略末尾斜杠所以https://example.com/和https://example.com等價。缺點是只要 URL 里多一個參數(shù)、少一個目錄就匹配不上適合只針對單篇文章、單個頁面的場景。2. 域名匹配最常用的 Firefox 標(biāo)簽欄顏色規(guī)則這是大多數(shù)人的首選寫法就是不帶協(xié)議的域名可帶可選的路徑example.comexample.com/blog它最大的好處是自動覆蓋所有子域名寫example.com那么www.example.com、mail.example.com都能命中。協(xié)議https://、http://寫不寫都行帶路徑時則要求路徑前綴一致example.com/blog能匹配example.com/blog/post。3. 通配符寫法*、**與?的規(guī)則這是新手最容易踩坑的地方ATBC 的通配符規(guī)則如下符號含義注意事項**匹配任意長度的任意字符包括/、.、:*匹配任意字符但不匹配/、.、:?匹配任意單個字符一個?只占一個位置舉幾個例子幫助理解https://*.example.com—— 注意*不匹配.所以這里的*只能替代一個子域名段如news.example.com但匹配不了a.b.example.comhttps://**.example.com—— 換成**就能匹配任意層級的子域名https://example.com/path/*—— 匹配path/下一層任意內(nèi)容但*不跨/所以到path/a/b就失效example.com/????—— 匹配任意 4 個字符組成的路徑段另外協(xié)議前綴是可選的寫*.example.com與https://*.example.com等效。4. 正則表達(dá)式進(jìn)階用戶的終極武器ATBC 會把你輸入的內(nèi)容當(dāng)作正則處理并且自動加上^和$錨點即必須從頭到尾完全匹配同時不區(qū)分大小寫。常見的實用寫法.*\.example\.com—— 匹配 example.com 及其所有子域名含多級https://.*\.example\.com/.*—— 限定 https 協(xié)議并帶任意路徑example\.(com|org|net)—— 匹配多個頂級域名 如果正則寫錯語法無效這條規(guī)則會被靜默忽略所以寫完后務(wù)必測試。三、規(guī)則優(yōu)先級后寫的規(guī)則說了算ATBC 會從上到下遍歷整張規(guī)則列表后面的匹配結(jié)果會覆蓋前面的。舉例先寫了一條example.com指定紅色再寫一條news.example.com指定藍(lán)色那么訪問news.example.com時用的是藍(lán)色。建議把「范圍大、通用性強」的規(guī)則放前面把「范圍小、特例」的規(guī)則放后面形成一個「默認(rèn) → 特例」的層級。四、三種「做什么」給匹配加上動作匹配寫法只是「瞄準(zhǔn)」還需要告訴 ATBC「開火」specify a colour指定顏色直接給該網(wǎng)站指定一個固定顏色這是最常見的用法use/ignore theme color使用/忽略主題色強制使用網(wǎng)站提供的 theme-color或反過來忽略它全局忽略在高級設(shè)置里也能開pick colour from element從元素取色輸入 CSS 選擇器例如header、.hero-banner、#logoATBC 會讀取該元素顏色作為標(biāo)簽欄顏色元素找不到時會回退到頁面取色 順帶一提如果你只想快速給「當(dāng)前網(wǎng)站」加一條規(guī)則直接在擴展彈窗里點Add a new ruleATBC 會自動用當(dāng)前域名生成一條規(guī)則見 RuleWidget.tsx再手動微調(diào)即可。五、實戰(zhàn)速查表照著抄就行需求匹配寫法header 一欄整個網(wǎng)站用指定顏色example.com某子域名用指定顏色mail.example.com網(wǎng)站 所有層級子域名**.example.com單個文章頁https://example.com/blog/2024/01/01某目錄下所有頁面example.com/docs多個域名共用一條規(guī)則.*\.(example|test)\.com只想管深色模式寫法不變把 scheme 切到 dark六、常見問題排查清單規(guī)則沒生效先確認(rèn) scheme 是否與當(dāng)前明暗模式匹配再確認(rèn)前面有沒有更靠后的規(guī)則覆蓋了它*匹配不到帶/的路徑這是正常的路徑用**或直接寫完整 URL輸入框標(biāo)紅提示「This rule will be ignored」說明寫法無法被識別檢查正則是否合法、通配符是否放錯位置規(guī)則只在部分頁面生效Firefox 的受保護頁面如about:頁、擴展頁面不參與匹配這是瀏覽器的安全限制掌握以上四種寫法你就能把 ATBC 從「全自動傻瓜模式」升級成「指哪打哪的精準(zhǔn)模式」——既能讓所有網(wǎng)站自動跟隨配色又能為個別網(wǎng)站定制專屬的 Firefox 標(biāo)簽欄顏色?？烊ミx項頁試試吧【免費下載鏈接】Adaptive-Tab-Bar-ColourChanges the colour of Firefox theme to match the website’s appearance.項目地址: https://gitcode.com/gh_mirrors/ad/Adaptive-Tab-Bar-Colour創(chuàng)作聲明：本文部分內(nèi)容由AI輔助生成（AIGC），僅供參考