將border-radius屬性設置爲-1有什麼用處嗎？

偶然的，當我掃描發現的here的CSS文件時，我注意到了我在任何CSS資源中從未見過的東西。編寫此CSS的開發人員在樣式表中的若干位置將border-(top-left-|top-right-|bottom-left-|bottom-right-|)radius屬性設置爲-1（例如，搜索border-bottom-left-radius：-1）。將border-radius屬性設置爲-1有什麼用處嗎？

我知道border-radius屬性必須遵循顯示here（加上其他鏈接的資源）的格式。現在，我可以理解1個拼寫錯誤，但此樣式表中的border-radius屬性的值爲-1的值超過20個。所以我在CodePen上創建了一支新筆，並且如所料，值-1對相關元素的border-radius沒有影響（我使用了一個高度爲100px，寬度爲200px的div）。

當檢查Firefox中的元素（當border-radius設置爲-1）時，該值被標記爲無效（在Chrome上檢查元素時）。

有誰知道是否對某些瀏覽器或場景-1是一個有效的值border-radius？我猜測這只是一個故意設置的無效佔位符，用於開發人員的內部簿記。

來源

2016-10-10 The One and Only ChemistryBlob

根據在W3上聲明的有效性，您需要傳遞任何長度單位或％....上的值，因此沒有單位的數字無效。也在這兩種情況下的長度或百分比*負值是不允許的* – DaniP

@DaniP我知道這一點，但我想知道這是否是例如一些瀏覽器特定的破解 –

我不認爲你會在這裏找到答案。據我們所知，它可能是一個瀏覽器黑客。（如果有瀏覽器，其中-1會將值重置爲默認值或某些值，但在大多數情況下，它很容易被忽略，這是在不同瀏覽器上導致不同結果的技巧。）儘管如此，這是純粹的推測你會到達這裏。詢問相關網站的創作者。 –

鑑於CSS使用Bootstrap作爲起點，很可能這些負值是無意的。規則的數量將由於使用CSS預處理器（Less或Sass）和變量的使用：Bootstrap大量利用變量，所以更改單個值的簡單情況（在此例中爲$border-radius-base）可能導致多條規則在變化。

拼圖的最後一塊：負值本身。它看起來像Bootstrap開發人員在幾個地方減去邊界半徑值1;它可能是某種對某個1px邊界的某種調整。我的猜測是，在某些時候某人決定完全放棄邊界半徑，將$border-radius-base設置爲0，這反過來導致一些負值彈出。由於無效規則被瀏覽器忽略，除了OP，沒有人注意到！

來源

2016-10-10 21:31:52 Dre

將border-radius屬性設置爲-1有什麼用處嗎？

回答

相關問題