根据浏览器显示界面大小变换，替换css文件方法
2016-03-31 12:03
597 查看
在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
在大于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实现的loading页面等待效果
- LESS CSS 框架简介
- clearfix:after 清除css浮动
- 史上最全的CSS hack方式一览
- 笔记 - 10.4、HTML - CSS滤镜笔记
- CSS声明各个浏览器私有属性的命名前缀
- 笔记 - 10.3、HTML - CSS样式笔记1
- 笔记 - 10.2、HTML - CSS选择器笔记
- 笔记 - 10.1、HTML - CSS概念笔记
- css 兼容大全
- 用HTML+CSS实现简单的下拉列表
- CSS左侧固定宽 右侧自适应(兼容所有浏览器)
- css3小知识点收录
- float在ie浏览器上的兼容问题
- CSS实现水平垂直居中小结
- 关于CSS中float和position的使用
- 判断浏览器是否支持css3属性或单位
- 【转】CSS3 Box-sizing
- CSS hack
- css实现文本过长时自动添加省略号