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. Web大文件下载控件(down2)-示例更新-Xproer.HttpDownloader

    版权所有 2009-2016 荆门泽优软件有限公司 保留所有权利 官方网站:http://www.ncmem.com/ 产品首页:http://www.ncmem.com/webapp/down2/i ...

  2. 在c++这片神秘的大陆上

    在c++这片神秘的大陆上,有一个无往而不利的地下王国,据说其手段血腥残忍,却深得民心,因为,他们是侠,是剑胆琴心,诗肠酒骨的侠客,他们不知解决了多少疑难杂症,除去了多少问题漏洞,而他们的首领-> ...

  3. Make Notepad++ auto close HTML/XML tags after the slash(the Dreamweaver way)

    I've been looking for a Notepad++ plugin that can close HTML/XML tags after a slash just like the wa ...

  4. js基础知识:表达式

    一.什么是表达式?我理解的"表达式":程序执行到1个"表达式"时,会返回1个值到这个"表达式"所在的位置. var a = 10 , b = ...

  5. SQL Server里的闩锁介绍

    在今天的文章里我想谈下SQL Server使用的更高级的,轻量级的同步对象:闩锁(Latch).闩锁是SQL Server存储引擎使用轻量级同步对象,用来保护多线程访问内存内结构.文章的第1部分我会介 ...

  6. 5天玩转C#并行和多线程编程 —— 第二天 并行集合和PLinq

    5天玩转C#并行和多线程编程系列文章目录 5天玩转C#并行和多线程编程 —— 第一天 认识Parallel 5天玩转C#并行和多线程编程 —— 第二天 并行集合和PLinq 5天玩转C#并行和多线程编 ...

  7. Java提高配(三七)-----Java集合细节(三):subList的缺陷

    我们经常使用subString方法来对String对象进行分割处理,同时我们也可以使用subList.subMap.subSet来对List.Map.Set进行分割处理,但是这个分割存在某些瑕疵. 一 ...

  8. 在XML drawable中引用自定义颜色

    == 先看一下一个xml drawable文件,这是一个button的样式. <?xml version="1.0" encoding="utf-8" ? ...

  9. 【转】优化Web程序的最佳实践

    自动排版有点乱,看着蛋疼,建议下载中文PDF版阅读或阅读英文原文. Yahoo!的Exceptional Performance团队为改善Web性能带来最佳实践.他们为此进行了 一系列的实验.开发了各 ...

  10. 跨站脚本攻击XSS

    跨站脚本攻击(Cross Site Script为了区别于CSS简称为XSS)指的是恶意攻击者往Web页面里插入恶意html代码,当用户浏览该页之时,嵌入其中Web里面的html代码会被执行,从而达到 ...