在1024屏幕下,选择适配1024屏幕的css文件,

在大于1024屏幕下,选择适配大屏幕的css文件。

在html中的head标签中引用css文件时,加入media属性。

例:

<link rel="stylesheet" media="screen and (min-width:1025px)" type="text/css" href="...1920">

<link rel="stylesheet" media="screen and (max-width:1024px)" type="text/css" href="...1024">

在浏览器当前打开宽度大于等于1025px时,会选用href为1920路径的css

在浏览器当前打开宽度小于等于1024px时,会选用href为1024路径的css

根据浏览器显示界面大小变换,替换css文件方法的更多相关文章

  1. Selenium2学习-024-WebUI自动化实战实例-022-网站不同分辨率下页面样式展示兼容性问题解决方案 -- 设置浏览器显示区域大小(无人值守,节约测试成本的福音,BOSS 最爱)

    在 Web UI 自动化测试的过程中,通常会测试页面在不同分辨率下的显示效果,即在不同大小的显示器上全屏浏览器后的页面展示,此种测试方法需要购置不同大小的显示器,或者频繁的设置屏幕分辨率,不仅浪费了大 ...

  2. Selenium2学习-023-WebUI自动化实战实例-021-获取浏览器显示区域大小,通过 WebDriver 截图功能

    之前的博文 020-JavaScript 在 Selenium 自动化中的应用实例之二(获取浏览器显示区域大小) 简述了通过 JavaScript 获取浏览器显示区域大小,此文将简述另一种获取浏览器显 ...

  3. Selenium2学习-022-WebUI自动化实战实例-020-JavaScript 在 Selenium 自动化中的应用实例之二(获取浏览器显示区域大小)

    前几篇文章中简略概述了,如何获取.设置浏览器窗口大小,那么我们该如何获取浏览器显示区域的大小呢?此文讲对此进行简略概述,敬请各位小主参阅.若有不足之处,敬请各位大神指正,不胜感激! 获取浏览器显示区域 ...

  4. jquery动态加载js/css文件方法

    先来看jquery自带的getSrcript文件 方法 代码如下 复制代码 $.getScript(url,callback) 实例 代码如下 复制代码 var testVar = 'New JS l ...

  5. Win10 及 Google 浏览器显示界面异常

    win10 和 google 界面显示异常 win10 个别 ui 组件花屏,google 界面直接黑屏 解决方式 更新集成显卡或者重装显卡驱动,最好使用 驱动人生 !!!

  6. 基于js的网页换肤(不需要刷新整个页面,只需替换css文件)

    1. [代码][JS]代码    <HTML><HEAD><link ID="skin" rel="stylesheet" typ ...

  7. js或css文件合并的三种方式推荐

    源文档 <http://www.jb51.net/article/32834.htm> 在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一 ...

  8. 引用CSS文件到html网页里方法

        引用CSS文件到Html方法-css引入,css引用 使用不同的方法来引用css样式表,最终到达的效果相同,但是使用不同方法应用的css文件将影响到SEO及网页打开速度效率. html引用cs ...

  9. 在html页面引用css文件的方法

    引用CSS文件到Html方法-css引入,css引用 使用不同的方法来引用css样式表,最终到达的效果相同,但是使用不同方法应用的css文件将影响到SEO及网页打开速度效率. html引用css方法如 ...

随机推荐

  1. React Native知识1-FlexBox 布局内容

    一:理论知识点 1:什么是FlexBox布局? 弹性盒模型(The Flexible Box Module),又叫Flexbox,意为“弹性布局”,旨在通过弹性的方式来对齐和分布容器中内容的空间,使其 ...

  2. android 性能分析案例

    本章以实际案例分析在android开发中,性能方面的优化和处理.设计到知识点有弱引用,memory monitor,Allocation Tracker和leakcanary插件. 1.测试demo ...

  3. 《java JDK7 学习笔记》之Collection

    一.使用Collection 收集对象 1.认识Collection架构 Java SE提供了满足各种需求的API,在使用这些API前,建议先了解其继承与接口操作架构,才能了解何时使用哪个类,以及类之 ...

  4. 012.对netmap API的解读

    一.简要说明: 1.netmap API主要为两个头文件netmap.h 和netmap_user.h ,当解压下载好的netmap程序后,在./netmap/sys/net/目录下,本文主要对这两个 ...

  5. Google的Java常用类库 Guava资料

    java的人应该都知道Apache commons的java常用类库吧,这个Guava和commons一样,封装出一套比jdk本身提供的常用类库强大.既然有了这个这么强大的类库,我们就没必要重复造轮子 ...

  6. linux中文件(档案)和目录的RWX权限意义

    1 权限对文件的意义 权限对文件的意义很好理解,下面我们看看权限对目录的意义. 2 权限对目录的意义 档案是存放实际资料的所在,那么目录主要是储存啥玩意啊?目录主要的内容在记录档名清单,档名与目录有强 ...

  7. Openstack基本命令

    Openstack有数量众多的命令行工具(CLI),用来执行各式各样的管理任务,例如VM管理.存储管理.网络管理.本文描述用Openstack CLI工具执行如下任务: 设置环境变量 使用内置帮助 创 ...

  8. Linux日志不记录问题

    问题原因 查看/var/log/secure发现日志为空,不记录. 查看/var/log/messages发现日志文件过大,然后做了如下操作 mv messages messages-xxxxxxxx ...

  9. Ngnix下安装python2.7

    1 mkdir data 创建data目录 2 cd data 切换到data目录下 3 mkdir python27 创建python27目录 4 将下载好的python压缩包放在python27目 ...

  10. USACO2.4 The Tamworth Two[模拟]

    题目描述 两只牛逃跑到了森林里.农夫John开始用他的专家技术追捕这两头牛.你的任务是模拟他们的行为(牛和John). 追击在10x10的平面网格内进行.一个格子可以是: 一个障碍物, 两头牛(它们总 ...