<div class="a"> 123 </div>

  @media(orientation:portrait) and (max-width:600px){
    .a{
      color:red;
    }
 
  }
  @media(min-width:300px) and (max-height:300px){
    .a{
      color:blue;
    }
  }
 
  这样就可以实现响应式的效果

响应式css样式的更多相关文章

  1. LayoutSimple简易响应式CSS布局框架

    开发这个css布局的目的是为了少做一些重复的工作,一是前端或多或少会开发一些很小的响应式项目, 二是UI设计的出来的界面总是各种布局各种样式,这个时候如果前端去使用Bootstrap或者Foundat ...

  2. kube框架结构-一个小型响应式CSS框架

    当你开始初建一个新的项目时,你可能需要一个不太复杂的基础框架,Kube框架应该是你最好的选择.一个独立的CSS文件,帮助你更简单的创建响应式的的布局设计. Kube Framework包括网格.按钮. ...

  3. elf,基于flexbox的响应式CSS框架

    官网地址:http://jrainlau.github.io/elf/项目地址:https://github.com/jrainlau/elf 介绍 取名为"精灵"的elf,是一个 ...

  4. SpaceBase – 基于 Sass 的响应式 CSS 框架

    SpaceBase 是一个基于 Sass 的响应式 CSS 框架.SpaceBase 是可以在建立和定制您的需要的一个样板层,它结合最佳实践为今天的响应式网页与我们对每一个项目中使用的核心组件. 在线 ...

  5. 外部式css样式,写在单独的一个文件中

    外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<style>标签内)使用<l ...

  6. 内联式css样式,直接写在现有的HTML标签中

    CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种.这一小节先来讲解内联式. 内联式css样式表就是把css代码直接写在现有的HTML标签中 ...

  7. 实现响应式——CSS变量

    CSS 变量是 CSS 引入的一个新特性,目前绝大多数浏览器已经支持了,它可以帮助我们用更少的代码写出同样多的样式,大大提高了工作效率,本篇文章将教你如何使用 CSS 变量(css variable) ...

  8. Gumby – 基于 Sass 的灵活的,响应式 CSS 框架

    Gumby 框架是一个基于 SASS 的灵活的,响应式的 CSS 框架.可以借助其灵活,响应式的网格系统和 UI 套件快速创建逻辑的页面布局和应用程序原型. 您可能感兴趣的相关文章 35个让人惊讶的 ...

  9. 响应式 css

    1.class 样式一般用class,命名:中横线分隔,如:div-logo id 一般用于js快速地区别和获取元素,命名:驼峰命名法,如:divLogo (中间首字母大写) 2.必不可少的图片,用& ...

随机推荐

  1. mysql控制台常用命令

    登录: D:\seegot\mysql5.5.36\bin> mysql -uroot -proot Welcome to the MySQL monitor. Commands end wit ...

  2. 06 Windows编程——设备句柄 和 WM_PAINT消息

    windows程序在现实方式上属于图形方式,和文字方式的显示,有显著的不同. 什么是设备句柄,如何获取 使用统一的数据结构表示某一设备,这个结构就是设备句柄. 源码 #include<Windo ...

  3. 网络设备驱动程序-netdevice结构体关键部分注释

    仅仅做个记录,内核4.19 struct net_device { char name[IFNAMSIZ]; //网络设备的名称 struct hlist_node name_hlist; char ...

  4. centos7防火墙相关

    selinux(保护文件安全) 安全增强型 Linux(Security-Enhanced Linux)简称 SELinux,它是一个 Linux 内核模块,也是 Linux 的一个安全子系统. SE ...

  5. Ubuntu系统---开机总会显示错误报告处理

    Ubuntu系统---开机总会显示错误报告处理 使用ubuntu16.04,开机总会显示错误报告,略烦人,查找方法关闭.一.临时关闭sudo service apport stop(重启后失效) 二. ...

  6. Sonya and Exhibition

    http://codeforces.com/group/1EzrFFyOc0/contest/1004/problem/B #include<iostream> #include<c ...

  7. Hive运行引擎Tez的安装

    简介 Tez是Apache开源的支持DAG作业的计算框架,它直接源于MapReduce框架,核心思想是将Map和Reduce两个操作进一步拆分,即Map被拆分成Input.Processor.Sort ...

  8. 如何使用 Vue 来实现一个项目多平台打包?

    这个需求是源于我们要根据一个项目,针对某些组件(比如:日期 和 下拉组件 ) 和 页面 做终端的兼容,最终需要实现打包成2个平台:h5 和 pc  H5平台,日期组件:                ...

  9. i p _ i n s e r t o p t i o n s函数

    i p _ o u t p u t函数接收一个分组和选项.当 i p _ f o r w a r d调用该函数时,选项已经是分组的一部分,所以 i p _ f o r w a r d总是把一个空选项指 ...

  10. python----获取文件的路径(各种方式)

    #获取到当前文件的上个文件夹目录ABSPATH = os.path.abspath(os.path.realpath(os.path.dirname(__file__))) #获取的是相对路径FRON ...