」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 如何在 CSS 媒體查詢中使用「OR」邏輯組合多個條件?

如何在 CSS 媒體查詢中使用「OR」邏輯組合多個條件?

發佈於2024-12-21
瀏覽:905

How Can I Use

使用OR 邏輯組合CSS 媒體查詢中的多個條件

在CSS 媒體查詢中,使用「OR」邏輯指定多個條件可能很有用用於定位具有不同螢幕尺寸或方面的裝置。雖然問題中提供的程式碼不正確,但有一個簡單的方法可以實現所需的結果。

要使用「OR」邏輯指定多個條件,請用逗號分隔:

@media screen and (max-width: 995px), screen and (max-height: 700px) {
  ...
}

如https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries 的文件所述:

"逗號用於組合多個逗號分隔清單中的每個查詢都與其他查詢分開處理,因此,如果清單中的任何查詢為true,則整個媒體語句將傳回true。 。如果符合任一條件,將套用媒體查詢中指定的樣式。
最新教學 更多>
  • 插入資料時如何修復「常規錯誤:2006 MySQL 伺服器已消失」?
    插入資料時如何修復「常規錯誤:2006 MySQL 伺服器已消失」?
    插入記錄時如何解決「一般錯誤:2006 MySQL 伺服器已消失」介紹:將資料插入MySQL 資料庫有時會導致錯誤「一般錯誤:2006 MySQL 伺服器已消失」。當與伺服器的連線遺失時會出現此錯誤,通常是由於 MySQL 配置中的兩個變數之一所致。 解決方案:解決此錯誤的關鍵是調整wait_tim...
    程式設計 發佈於2024-12-22
  • 如何在Go的SQL包中查詢未知列類型的資料?
    如何在Go的SQL包中查詢未知列類型的資料?
    探索Go 的SQL 套件中的臨時查詢雖然文件顯示使用SQL 套件在Go 中查詢資料需要了解列數和編譯時類型,這並不嚴格正確。 sql.Rows 類型為靈活且即席的 SQL 查詢提供了解決方案。 動態列元資料擷取sql.Rows 中的 Columns 方法提供了以下清單:結果列名稱。這允許您動態確定任...
    程式設計 發佈於2024-12-22
  • 您可以在 C++ 中重載內建類型(例如“int”和“float”)的運算子嗎?
    您可以在 C++ 中重載內建類型(例如“int”和“float”)的運算子嗎?
    可以為內在型別重載運算子嗎? 在 C 中,可以為使用者定義型別重載運算子。然而,int、float等內在類型不是使用者定義的,所以問題來了:它們的運算子可以重載嗎? 如同提供的答案所述,不可能重新定義內建運算子。運算子重載是一種機制,允許開發人員透過在自己的類型上下文中定義運算子的自訂行為來擴展語言...
    程式設計 發佈於2024-12-22
  • 為什麼 Selenium 會拋出「WebDriverException:訊息:『Webdrivers』可執行檔可能有錯誤的權限」錯誤?
    為什麼 Selenium 會拋出「WebDriverException:訊息:『Webdrivers』可執行檔可能有錯誤的權限」錯誤?
    Selenium 中的「Webdrivers」可執行權限錯誤問題描述嘗試在Python 中使用Selenium 時,您可能會遇到錯誤訊息:WebDriverException: Message: 'Webdrivers' executable may have wrong permissions. ...
    程式設計 發佈於2024-12-22
  • HTML 格式標籤
    HTML 格式標籤
    HTML 格式化元素 **HTML Formatting is a process of formatting text for better look and feel. HTML provides us ability to format text without us...
    程式設計 發佈於2024-12-22
  • 如何使用 WHERE 子句在 MySQL 中查詢 JSON 資料?
    如何使用 WHERE 子句在 MySQL 中查詢 JSON 資料?
    如何在 MySQL 中查詢 JSON 資料在 MySQL 資料庫中,JSON 物件可以儲存在表格列中。但是,如果沒有適當的技術,運行利用這些 JSON 欄位的查詢可能會很困難。本指南提供了使用 WHERE 子句輕鬆查詢 JSON 資料的方法,使開發人員能夠根據 JSON 物件屬性過濾和檢索特定記錄。...
    程式設計 發佈於2024-12-22
  • 為什麼我的 CSS 背景圖片簡寫會產生「操作符不正確」錯誤?
    為什麼我的 CSS 背景圖片簡寫會產生「操作符不正確」錯誤?
    背景圖像錯誤:識別不正確的運算符嘗試使用簡寫符號設定具有背景圖像的div 元素樣式時,某些使用者會遇到關於不正確運算子的錯誤:錯誤:CSS:背景:/是不正確的運算子。 要修正此問題,了解背景屬性的正確語法至關重要。根據CSS規範,/字元充當background-position和background...
    程式設計 發佈於2024-12-22
  • 儘管程式碼有效,為什麼 POST 請求無法擷取 PHP 中的輸入?
    儘管程式碼有效,為什麼 POST 請求無法擷取 PHP 中的輸入?
    解決PHP 中的POST 請求故障在提供的程式碼片段中:action=''而非:action="<?php echo $_SERVER['PHP_SELF'];?>";?>"檢查$_POST陣列:表單提交後使用 var_dump 檢查 $_POST 陣列的內...
    程式設計 發佈於2024-12-22
  • 大批
    大批
    方法是可以在物件上呼叫的 fns 數組是對象,因此它們在 JS 中也有方法。 slice(begin):將陣列的一部分提取到新數組中,而不改變原始數組。 let arr = ['a','b','c','d','e']; // Usecase: Extract till index ...
    程式設計 發佈於2024-12-22
  • 如何在 PHP 中組合兩個關聯數組,同時保留唯一 ID 並處理重複名稱?
    如何在 PHP 中組合兩個關聯數組,同時保留唯一 ID 並處理重複名稱?
    在 PHP 中組合關聯數組在 PHP 中,將兩個關聯數組組合成一個數組是常見任務。考慮以下請求:問題描述:提供的代碼定義了兩個關聯數組,$array1 和 $array2。目標是建立一個新陣列 $array3,它合併兩個陣列中的所有鍵值對。 此外,提供的陣列具有唯一的 ID,而名稱可能重疊。要求是建...
    程式設計 發佈於2024-12-22
  • 為什麼「正在載入類別 com.mysql.jdbc.Driver...」已被棄用,如何修復它?
    為什麼「正在載入類別 com.mysql.jdbc.Driver...」已被棄用,如何修復它?
    了解「Loading Class com.mysql.jdbc.Driver ... Is Deprecated」訊息嘗試連接到MySQL 時使用舊的驅動類別com.mysql.jdbc.Driver的資料庫,你可能會遇到一個諮詢訊息:Loading class com.mysql.jdbc.Dri...
    程式設計 發佈於2024-12-22
  • 如何處理 Java XPath 查詢中的 XML 命名空間?
    如何處理 Java XPath 查詢中的 XML 命名空間?
    Java XPath 查詢中的XML 命名空間處理在Java 中,當使用XPath 查詢XML 時,命名空間可能會帶來挑戰。當 XML 不包含命名空間時,XPath 查詢可以很簡單,但命名空間的存在會帶來複雜性。 情況 1:沒有命名空間的 XML對於沒有命名空間的 XML,XPath查詢使用預設命名...
    程式設計 發佈於2024-12-22
  • Go 1.7 可以在 Windows 上建置 DLL 嗎?
    Go 1.7 可以在 Windows 上建置 DLL 嗎?
    使用Go 1.7 建構dll使用Go 1.7 建構dll在本文中,我們將探討在Windows 下針對Go v1.7 建置dll 的可能性. 問題:有沒有辦法建構一個dll Windows下Go v1.7? 背景:go build -buildmode=shared main.go嘗試使用經典方法建構...
    程式設計 發佈於2024-12-22
  • 如何在 PHP 和 MySQL 中有效處理時區?
    如何在 PHP 和 MySQL 中有效處理時區?
    PHP 和MySQL 中的時區PHP 和MySQL 中的時區將時區系統整合到PHP 應用程式中可能具有挑戰性,但在處理來自不同資料庫的數據時,這一點至關重要時區。這是解決最常見問題並提供實用解決方案的綜合指南。 在MySQL 中儲存日期時間使用DATETIME 或TIMESTAMP: DATETIM...
    程式設計 發佈於2024-12-22
  • Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta 中的列偏移發生了什麼事?
    Bootstrap 4 Beta:列偏移的刪除和恢復Bootstrap 4 在其Beta 1 版本中引入了重大更改柱子偏移了。然而,隨著 Beta 2 的後續發布,這些變化已經逆轉。 從 offset-md-* 到 ml-auto在 Bootstrap 4 Beta 1 中, offset-md-*...
    程式設計 發佈於2024-12-22

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3