CSS 實現布爾運算

CSS 不僅可以用來設置樣式，它還可以實現一些數學運算，例如加減乘除等。同時，CSS 還可以實現布爾運算，利用布爾運算可以實現各種邏輯判斷和控制。

CSS 實現布爾運算需要用到 CSS3 中的 calc() 函數。該函數已經廣泛使用于 CSS 計算值中，可以接受任何加減乘除的四則運算。這樣，我們就可以在 CSS 中實現布爾運算了。

以下是幾種常見的布爾運算及其 CSS 實現：

/* 1. 等于運算 */
div[data-value="1"] {
background-color: red;
}
/* CSS實現 */
div:only-child:nth-child(1n+2) {
background-color: red;
}
/* 2. 大于運算 */
div[data-value>="60"] {
border: 1px solid blue;
}
/* CSS實現 */
div:only-child:nth-last-child(n+3):nth-child(1n+2) {
border: 1px solid blue;
}
/* 3. 或運算 */
div[data-value="1"], div[data-value="2"] {
background-color: yellow;
}
/* CSS實現 */
div:only-child:nth-child(1n+2),
div:only-child:nth-child(1n+3) {
background-color: yellow;
}

通過加入不同的 CSS 選擇器，就可以實現更加復雜的布爾運算。