js控制手机横屏显示
css控制页面横屏显示
/* 当屏幕为竖屏时应用的样式 */ @media screen and (orientation: portrait){ /*要横屏显示的内容的外层盒子*/ #box { /* 设置基准点为左上角 */ transform-origin:top left; /* 以左上角为基准点,顺时针旋转90度 然后沿Y轴反方向平移100% */ /* 为什么沿Y轴,因为旋转使坐标轴方向发生了变化 */ transform: rotate(90deg) translateY(-100%); /*设置元素的宽度为 100%父元素的高度 并提高样式优先级 */ width: 100vh !important; /*设置元素的高度为 100%父元素的宽度 并提高样式优先级 */ height: 100vw !important; } } #box{ width: 100%; height: 100%; display: flex; border: 1px solid rebeccapurple; }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」