@media all and (orientation : landscape) { 

h2{color:red;}/*横屏时字体红色*/

} 

@media all and (orientation : portrait){ 

h2{color:green;}/*竖屏时字体绿色*/

}

  

CSS3(@media)判断手机横竖屏的更多相关文章

  1. zepto判断手机横竖屏

    var CheckOrientation = (function(){ var win = $( window ), get_orientation, last_orientation, initia ...

  2. JS判断手机横竖屏

    在移动端开发时,有时候需要判断手机的横竖屏,那么就需要用到window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 屏幕方向对应的window.orientat ...

  3. js 判断手机横竖屏的实现方法(不依赖任何其他库)

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. H5 手机横竖屏判读

    $.fn.screenCheck = function() { var pDiv = $('<div></div>'); pDiv.addClass("screenC ...

  5. Javascript 判断网页横竖屏

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

  6. javascript判断iphone/android手机横竖屏模式的函数

    function orientationChange(){ switch(window.orientation) { case 0: // Portrait case 180: // Upside-d ...

  7. js和css实现手机横竖屏预览思路整理

    实现效果,如上图. 首先,实现手机页面在PC端预览, 则先在网上找到一个手机的背景图片,算好大概内间距,用来放预览的页面,我这里是给手机预览页面的尺寸按iphone5的尺寸来的: 一个手机页面在这里预 ...

  8. iphone手机不同版本兼容、横竖屏

    /* 兼容问题*/ @media screen and (device-width: 320px) and (device-height: 480px) and (-webkit-device-pix ...

  9. js判断手机浏览器是横屏or竖屏

    移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 从而根据实际需求而执行相应的程序.通过添加监听事件onorientationc ...

随机推荐

  1. 用户界面样式(cursor,resize,vertical-align,outline,文字超出显示省略号)

    1. 鼠标样式 cursor default: 小白(箭头)默认 pointer:小手 move:移动 text:文本 not-allowed:禁止 2. 轮廓线(表单外发光)outline 给表单添 ...

  2. android 串口 android-serialport-api

    最近在做Android串口的开发,找到一个开源的串口类android-serialport-api.其主页在这里http://code.google.com/p/android-serialport- ...

  3. 【Luogu】【关卡2-8】广度优先搜索(2017年10月)

    任务说明:广度优先搜索可以用来找有关“最短步数”的问题.恩,也可以用来“地毯式搜索”.

  4. @Condition 条件化注册Bean

    看<Spring源码深度解析>笔记 1.@Condition: 按照一定的条件进行判断,满足条件给容器中注册bean:实例: 根据系统给容器中注册Bean,如果是windows注册(“bi ...

  5. Java HashMap问题

    1:map集合简述:         我们常用的集合实现类有HashMap.LinkedHashMap.TreeMap,HashTable.HashMap根据key的hashCode值来保存value ...

  6. SpringCloud---分布式服务跟踪---Spring Cloud Sleuth

    1.概述 1.1 为什么要用到服务跟踪? 随着业务的发展,系统规模也会变得越来越大,各服务之间的调用关系也变得越来越错综复杂: 通常一个由客户端发起的请求   在后端系统中会经过多个不同的微服务调用  ...

  7. 关于axios中post请求提交后变成get的问题

    这个问题归结于自己的不细心,如下图. 头疼了好久,才发现是自己多写了一个s,在此记录一下.

  8. vue 多选框 checkbox 父到子传值

    vue多选功能, 修改时选中的状态不能从当前组件中得到,从父组件中传过来. 这里 新增和修改封装了一个组件,在点击确定按钮后,会发送新增或修改请求,重新渲染页面.但是在点击[新增]/ [修改]按钮时, ...

  9. docker组件如何协作(7)

    还记得我们运行的第一个容器吗?现在通过它来体会一下 Docker 各个组件是如何协作的. 容器启动过程如下: Docker 客户端执行 docker run 命令. Docker daemon 发现本 ...

  10. mail----java发送普通邮件

    package com.mail; import java.io.UnsupportedEncodingException; import java.util.Date; import java.ut ...