?
This document uses PHP Chinese website manual Release
orientation:portrait | landscape
接受min/max前綴:是
portrait:指定輸出設(shè)備中的頁面可見區(qū)域高度大于或等于寬度
landscape:除portrait值情況外,都是landscape
本特性不接受min和max前綴。
簡單列舉幾個應(yīng)用示例:
@media screen and (orientation:portrait){ … } @import url(example.css) screen and (orientation:landscape);
<!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8" /> <title>media features orientation_CSS參考手冊_web前端開發(fā)參考手冊系列</title> <meta name="author" content="Joy Du(飄零霧雨), dooyoe@gmail.com, www.doyoe.com" /> <style> .test::after { color: red; } @media screen and (orientation: portrait){ .test::after { content: "豎屏"; } } @media screen and (orientation: landscape){ .test::after { content: "橫屏"; } } </style> </head> <body> <div class="test">你現(xiàn)在是:</div> </body> </html>
點擊 "運行實例" 按鈕查看在線實例