*新闻详情页*/>
款式
@media screen and (orientation: portrait) { html{ width : 100vmin; height : 100vmax; } body{ width : 100vmin; height : 100vmax; } #gyroContain{ width : 100vmax; height : 100vmin; transform-origin: top left; transform: rotate(90deg) translate(0,⑴00vmin); } } @media screen and (orientation: landscape) { html{ width : 100vmax; height : 100vmin; } body{ width : 100vmax; height : 100vmin; } #gyroContain{ width : 100vmax; height : 100vmin; } }
构造
<html> <body> <div id="gyroContain"> 十分多十分多的文本 </div> </body> </html>
P.S. 假如你的网页页面里有from表单要填的话,应当用 「弹出遮罩层让客户转动手机上」 的处理计划方案。检验手机上竖屏下,提醒用关掉显示屏转动锁住,并横置手机上。想一想手机上访问器還是竖屏,而內容却被强制性横屏的画面有多怪异吧...
P.S. 网页页面强制性横屏是1碗都快放坏了的冷饭。但文主百度搜索到的处理方式都用了js。文主感觉一些高炮打蚊子。因此自身用Css+Html完成了1个。文章内容内的编码只是1个给大伙儿发散逻辑思维的littleDemo,你们想竖屏翻转就去掉height加y-auto, 想有情况色就加bg-color,还望大伙儿不必征讨我的不认真细致啊。第1篇文章内容,望海涵。
以上便是本文的所有內容,期待对大伙儿的学习培训有一定的协助,也期待大伙儿多多适用脚本制作之家。
Copyright © 2002-2020 网站建设_创建网站_免费建站平台_智能建站_企业建网站 版权所有 (网站地图) 粤ICP备10235580号