CSS 中的判斷語句是指 CSS 媒體查詢,可以通過媒體查詢在不同屏幕尺寸下改變頁面的布局樣式。媒體查詢主要有以下兩種方式:
@media screen and (max-width: 768px) { /* 小屏幕下的樣式 */ }
以上代碼表示在屏幕寬度小于等于 768 像素時生效。該寫法中的@media
表示定義一個媒體查詢,screen
是值表示該媒體查詢僅在屏幕中才會生效,max-width: 768px
表示屏幕寬度小于等于 768px 時,內部的樣式將生效。也可以通過min-width
來定義最小的屏幕寬度。
@media (orientation: landscape) { /* 表示橫屏時的樣式 */ }
以上代碼表示當屏幕顯示為橫屏時有不同的樣式。該寫法中的orientation
表示屏幕方向,landscape
表示橫屏時的樣式。
可以通過 CSS 媒體查詢在不同的屏幕環境下,提供更好的用戶體驗,增強網站的易用性。
上一篇new vue 更新
下一篇css中圖片加濾鏡灰