HTML代码:

<div class="screen-prompt"></div>

CSS判断代码:

/*横竖屏提示*/
@media screen and (orientation:landscape) {
.screen-prompt{ display: block;}
} @media all and (orientation : portrait){
.screen-prompt{ display: none;}
} .screen-prompt {
width: 100%;
height: 100%;
position: fixed;
top:;
right:;
bottom:;
left:;
z-index:;
background: #32373B url(screen_switch.gif) center center no-repeat;
background-size: contain;
}

HTML5横竖屏提示的更多相关文章

  1. ios单独的页面支持横竖屏的状态调整,HTML5加载下(更新2)

    单独的页面支持横竖屏的状态调整,HTML5加载下 工程中设置只支持竖屏状态,在加载HTML5的界面可以是横竖屏的,在不对工程其他界面/设置做调整的同时,可以这样去 #import "View ...

  2. PhoneGap Html5 App 横竖屏切换自动退出

    将以下内容添加到 AndroidManifest.xml 文件的 activity 标签中: android:configChanges="orientation|keyboardHidde ...

  3. Javascript 判断网页横竖屏

    本篇文章由:http://xinpure.com/javascript-to-determine-page-anyway-screen/ Html5 流行至今,自适应的网站已经多如牛毛,但是横竖屏的切 ...

  4. ios5和ios6横竖屏支持及ipad和iphone设备的判断

    ios5和ios6横竖屏支持及ipad和iphone设备的判断 判断是ipad还是iphone设备.此定义在PayViewControllerDemo-Prefix.pch 定义如下: #define ...

  5. HTML5全屏浏览器兼容方案

    最近一个项目有页面全屏的的需求,搜索了下有HTML5的全屏API可用,不过各浏览器的支持不一样. 标准 webkit  Firefox  IE Element.requestFullscreen() ...

  6. Android onConfigurationChanged用法(规避横竖屏切换导致的重新调用onCreate方法)

    onConfigurationChanged的目的是为了规避横竖屏切换干掉activity而重新调用onCreate方法的问题:有的时候,我们希望重新进入OnCreate生命周期,此时可以调用onSa ...

  7. orientation属性(判断是否为横竖屏)

    现在有一个需求:移动端网页默认竖屏显示,当用户横屏浏览,就给予相应提示,比如横屏时显示下面截图提示信息 几年前,可能大家想到用 window.orientation 属性来实现,现官方已弃用,不做推荐 ...

  8. Android APP 简单高效的禁用横竖屏切换

    默认情况下,Android APP的界面会随着手机方向的改变而改变,当手机处于竖屏状态,APP的界面也处于竖屏状态,而当手机处于横屏状态,APP也会自动切换到横屏状态.一般情况下APP的界面都是为竖屏 ...

  9. Android开发之Activity横竖屏切换生命周期重建问题

    当进行横竖屏切换的时候Activity的生命周期会重建,从而导致Activity崩溃等问题,为了避免这一问题,需要在AndroidManifest.xml文件中设置: <activity and ...

随机推荐

  1. src与 href 的一些区别

    src用于替换当前元素,href用于在当前文档和引用资源之间确立联系. src 是 source 的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置:在请求 src 资源时会将其指 ...

  2. "巴卡斯杯" 中国大学生程序设计竞赛 - 女生专场

    Combine String #include<cstdio> #include<cstring> #include<iostream> #include<a ...

  3. javadoc错误: 编码gbk的不可映射字符

    在使用Eclipse进行javadoc的导出时,提示“编码 GBK 的不可映射字符”,应该就是中文注释Eclipse不认,需要在调用javadoc.exe的时候传递编码集告诉它采用什么编码去生成jav ...

  4. testng xml中按顺序执行java类

    如红字部份,将安顺序执行4个类 <?xml version="1.0" encoding="UTF-8"?><suite name=" ...

  5. JavaScript 基础第七天(DOM的开始)

    一.引言 JavaScript的内容分为三个部分,这三个部分分别是ECMAScript.DOM.BOM三个部分组成.所谓ECMAScript就是JavaScript和核心基础语法,DOM是文档对象模型 ...

  6. json中$ref对象重复引用问题

    FastJson提供了SerializerFeature.DisableCircularReferenceDetect这个序列化选项,用来关闭引用检测.关闭引用检测后,重复引用对象时就不会被$ref代 ...

  7. Mac OS 中 安装配置软件

    1. (2014.1.22) 配置Apache + PHP + MySQL: http://dancewithnet.com/2010/05/09/run-apache-php-mysql-in-ma ...

  8. 《利用Python进行数据分析》第8章学习笔记

    绘图和可视化 matplotlib入门 创建窗口和画布 fig = plt.figure() ax1 = fig.add_subplot(2,2,1) ax2 = fig.add_subplot(2, ...

  9. FUND

    The Shaanxi Natural Science Plan Project of China Grant NO.: 2014JM8322

  10. Java 程序性能优化

    1. singleton延时初始化 class Singleton { private static Singleton _instance = null; public synchronized S ...