css3 媒体查询给手机横屏或是竖屏不一样的样式

直接上代码 媒体查询

	 /* 设备横屏时调用该段css代码 */@media all and (orientation : portrait){body {background-color:black;}}/* 设备横屏时调用该段css代码 */@media all and (orientation : landscape){body {background-color:red;}}

javascript 根据切换绑定事件实现判断横竖屏

/* 只能在触发旋转屏幕时生效*/
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {if (window.orientation === 180 || window.orientation === 0) {console.log("竖屏");}if (window.orientation === 90 || window.orientation === -90 ){console.log("横屏");}}, false);

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！