横竖屏rem布局的判断

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>Document</title>
<script type="text/javascript">
window.onload=function(){
function hengshuping(){
if(window.orientation==180||window.orientation==0){
document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth / 1330) + "px";
}
if(window.orientation==90||window.orientation==-90){
document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth / 640) + "px";
}
}
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", hengshuping, false);
}
</script>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
@media all and (orientation: portrait) {
div{
width: 100%;
height: 1rem;
background: red;
text-align: center;
line-break: 1rem;
}
}
@media all and (orientation: landscape) {
div{
width: 100%;
height: 3rem;
background: yellow;
text-align: center;
line-break: 1rem;
}
}
</style>
</head>
<body>
<div>
nihao
</div>
</body>
</html>

时间: 2024-11-05 23:32:51

横竖屏rem布局的判断的相关文章

android 横竖屏和布局问题

在这里我做了一个小test,之前看过关于这方面的东西,到后来我才真正的遇到项目的时候,不得已才要去真正的熟悉里面的流程. 这里我贴测试源码: TestActivity.java package cn.com.hrmdemo; import android.app.Activity; import android.content.res.Configuration; import android.os.Bundle; import android.widget.Toast; public clas

Android-layout的横竖屏处理

横竖屏处理是开发应用是比较基础的一个要点,几乎都会用到.网上有一大堆的横竖屏切换的文章,但是翻了n页以后发现竟然清一色的是转载,所以不想浪费时间到这个上面,还是自己根据自己的需求与体会总结一下吧,也方便以后查阅 一.layout-land和layout-prot的区别与使用 默认情况下,创建的Android项目里只有一个layout文件夹,尽管这样也可以横竖屏切换用,但是某些布局横屏过后闲的格外的丑,如下图 横屏过后就显示的不全了,有时候看着比较纠结.所以需要在横屏的使用重新载入新的布局文件 解

Android横竖屏切换总结

Android横竖屏切换总结(Android资料) Android横竖屏要解决的问题应该就两个: 一.布局问题 二.重新载入问题 1.布局问题:如果不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上android:screenOrientation属性,他有以下几个参数: "unspecified":默认值 由系统来判断显示方向.判定的策略是和设备相关的,所以不同的设备会有不同的显示方向. "lan

Android横竖屏总结全

Android横竖屏要解决的问题应该就两个: 一.布局问题 二.重新载入问题 1.布局问题:如果不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上android:screenOrientation属性,他有以下几个参数: "unspecified":默认值 由系统来判断显示方向.判定的策略是和设备相关的,所以不同的设备会有不同的显示方向. "landscape":横屏显示(宽比高要长) &

Android实战技巧之二十四:横竖屏切换

这几年一直在做手机上和电视盒的App,几乎没有考虑过横竖屏切换的问题.电视盒好说,横屏不变,你要是给它设计个竖屏人家也没机会使:而手机上的应用就不好说了,有些界面你设计了横竖屏兼容可能是为了表示你的功能强大.但是按照惯例,或许也是设计师图省事,我们只是做一个方案.就像目前主流的App都只有竖屏一个模式,比如微信.京东和招商银行.我截了几张图表示一下. 但是像地图之类的应用,也许横屏会显示的更友好一些.请看腾讯地图的设计如下: 细心的你会发现,地图的横竖屏的样式几乎是一样的布局,调整起来还是比较容

Android横竖屏切换处理

Android横竖屏要解决的问题应该就两个: 1.布局问题:2.重新载入问题   一.布局问题: 如果不想让软件在横竖屏之间切换,最简单的办法就是在项目的AndroidManifest.xml中找到你所指定的activity中加上android:screenOrientation属性,他有以下几个参数: "unspecified":默认值 由系统来判断显示方向.判定的策略是和设备相关的,所以不同的设备会有不同的显示方向. "landscape":横屏显示(宽比高要长

安卓横竖屏切换问题总结

如果不想让软件在横竖屏之间切换: 可以通过在AndroidManifest.xml中设置activity中的android:screenOrientation属性值来实现. 比如下列设置 android:screenOrientation="portrait" 则无论手机如何变动,拥有这个属性的activity都将是竖屏显示. android:screenOrientation="landscape",为横屏显示. 上述修改也可以在Java代码中通过类似如下代码来设

Android 切换横竖屏

一个项目一般会自己先定义项目是横屏还是竖屏但是也有可以横屏和竖屏之间切换的activty. 切换横竖屏的方法: //判断当前屏幕方向if(getRequestedOrientation() == ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE) { //切换竖屏 MainActivity.this.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);}else{ //切换横屏 Ma

Android横竖屏切换及其对应布局加载问题

第一,横竖屏切换连带横竖屏布局问题: 如果要让软件在横竖屏之间切换,由于横竖屏的高宽会发生转换,有可能会要求不同的布局. 可以通过以下两种方法来切换布局: 1)在res目录下建立layout-land和layout-port目录,相应的layout文件名不变,比如:layout-land是横屏的layout,layout-port是竖屏的layout,其他的不用管,横竖屏切换时程序调用Activity的onCreate方法中的setOnContent(xxx),并自动加载相应的布局. 2)假如布