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. col-md-*,col-xs-*

    class属性 col-md-*,md 表示 medium (中等的),* 代表一个数字,它指定了这个元素所占的列宽. 在中等大小的屏幕上(例如笔记本电脑),元素的列宽被指定了. col-xs-* , ...

  2. 【dubbo】消费者Consumer搭建

    一.consumer搭建(可以web/jar) 1.新建Maven项目,groupId:com.dubbo.consumer.demo artifactId:demo projectName:dubb ...

  3. ofbiz 代码日记

    写代码一定要尽善尽美.. //修改方法 //条件查询 用于修改 List<GenericValue> stoList = delegator.findByAnd("YcrossS ...

  4. MySql数据源配置

    1.tomcat的config/server.xml中将以下代码写到 </Host>前: <Context docBase="struts1" path=&quo ...

  5. 用cookie记住用户名

    有时候,我们在做登陆框时会有个复选框选择请记住我,或者有时候会遇到一些弹出框说下次不再提醒,此功能我们可以用js中的cookie实现此功能 下面记录一下如何实现该功能: 利用cookie记录用户名 1 ...

  6. JDK6环境下升级项目到springframework4.x和tomcat7.x

    springframework 3.x升级到 4.x  1 xsi:schemaLocation 对应的3.x->4.x 2 pom  springframework <propertie ...

  7. XMPP即时通信(基础)

      使用第三方框架 XMPPFramework   #import "ViewController.h" #import "XMPPFramework.h" @ ...

  8. 理解一下单片机的I2C和SPI通信

    应某位网友要求,今天说一下单片机的I2C SPI通信,可能说不清楚,因为这毕竟要做实验才可完全理解. I2C和SPI是两种不同的通信协议. 听到协议,似乎高不可攀,其实协议就是人们定义的一个标准而已, ...

  9. 【原创】还原Hyper-V 到一个新的虚拟机

    Context: I need to restore VM31 backup (via 'Windows Server Backup' tool) as another new Hyper-V mac ...

  10. IOS内测分发策略

    当苹果应用没有上交appstore审核,出于开始内侧阶段时,我们如何邀请别人测试和使用? plist苹果安装包实现 使用七牛云存储解决ios7.1的app部署问题 推荐两个现在比较流行的app内测辅助 ...