1. 图片自适应

<img src="app-logo.png"
     srcset="app-logo.png 175w,app-logo-double.png 365w"
     sizes="(max-width: 640px) 365px,175px"
/>

srcset: 资源文件列表  
sizes:(max-width: 640px) 365px,175px  宽度不超过640px使用365px大小的图片，其余情况使用175px大小的图片。

2. 界面自适应

@media screen and (min-width: 1280px) {}      分辨率最小为1280px
@media only screen and (max-width: 1280px) and (min-width: 640px)    分辨率最大为1280px,最小为640px

css自适应问题的更多相关文章

  1. css 自适应布局阮一峰

    转载一篇文章: 自适应网页设计(Responsive Web Design) 作者: 阮一峰 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小 ...

  2. css 自适应布局

    转载一篇文章: 自适应网页设计(Responsive Web Design) 作者: 阮一峰 移动设备正超过桌面设备,成为访问互联网的最常见终端.于是,网页设计师不得不面对一个难题:如何才能在不同大小 ...

  3. css自适应浏览器大小

    css自适应浏览器大小 1.屏幕 > 900px :显示3列 2.450px < 屏幕 < 900px :显示2列 3.屏幕 < 450px :显示1列 <!DOCTYP ...

  4. DIV+CSS自适应窗口高度

    <html> <head> <title>DIV+CSS自适应窗口高度</title> <style type="text/css&qu ...

  5. css 纯css自适应页面 示例

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  6. 这可能是史上最全的CSS自适应布局总结教程

    标题严格遵守了新广告法,你再不爽,我也没犯法呀!话不多说,直入正题. 所谓布局,其实包含两个含义:尺寸与定位.也就是说,所有与尺寸和定位相关的属性,都可以用来布局. 大体上,布局中会用到的有:尺寸相关 ...

  7. DIV+CSS自适应布局

    自适应布局分两类:高度和宽度,方法有很多,我用三列布局举例,我就列几个通俗易懂的例子呗,懂了三列的,两列的原理一样,呵呵哒. 效果图如下:高度自适应——宽度自适应            1,高度自适应 ...

  8. CSS自适应布局(左右固定 中间自适应或者右侧固定 左侧自适应)

    经常在工作中或者在面试中会碰到这样的问题,比如我想要个布局 右侧固定宽度 左侧自适应 或者 三列布局 左右固定 中间自适应的问题. 下面我们分别来学习下,当然我也是总结下而已,有如以下方法: 一: 右 ...

  9. CSS自适应布局(包括两边宽度固定中间宽度自适应与中间宽度固定两边宽度自适应)

    1.两边宽度固定,中间宽度自适应 (1)非CSS3布局,浮动定位都可以(以下用浮动) css样式: #left { float: left;width: 200px; background: lime ...

  10. [css] 自适应布局 移动端自适应

    一.宽度自适应 三列布局左右固定.中间不固定或者两列布局,左边固定右边不固定 原文链接:http://www.cnblogs.com/2050/archive/2012/07/30/2614852.h ...

随机推荐

  1. 力扣——3sum closest（最接近的三数之和）python 实现

    题目描述: 中文: 给定一个包括 n 个整数的数组 nums 和 一个目标值 target.找出 nums 中的三个整数,使得它们的和与 target 最接近.返回这三个数的和.假定每组输入只存在唯一 ...

  2. C# IOC DI 学习

    之前一直不理解IOC DI,今天使劲研究了下,感觉朦朦胧胧有点感觉了,网上的这篇文章对我的有很大的启发 http://www.cnblogs.com/jin-yuan/p/3823559.html 我 ...

  3. 一次CTS引发的网络故障

    接到业务部门通知,A机房(库a)到B机房(库b)之间的数据库服务器之间的网络带宽异常突增,影响公司对外业务的整体带宽.一接到通知,作为数据库管理对所涉及的IP还是比较敏感.第一反应就是可能当时主库产生 ...

  4. Delphi正则表达式使用方法（TPerlRegEx）

    目前主流的delphi下的正则表达式,应该是 PerlRegEx . 官方网站: http://www.regular-expressions.info/delphi.html    直接下载: ht ...

  5. AcWing 231. 天码 （容斥）打卡

    题目:https://www.acwing.com/problem/content/233/ 题意:给你n个不同的数,让你选取一个四元组,gcd为1,让你求这样的四元组数量是多少 思路:我们单独直接去 ...

  6. linux基础知识汇总(三）-vmware下ubuntu上网配置

    方式1 : 使用NAT共享IP的方式.使用这种方式什么都不用设置就可以在ubuntu中上网冲浪了. 备注: 1.如果ubuntu还不能上网的话,可以到我们的电脑的“服务”里面,检查“VMware NA ...

  7. webpack中的url-loader

    使用url-loader引入图片,可以说它是file-loader的增强版 url-loader会把我们的图片使用base64的形式编码成另外一种字符串,网页是可以识别这种编码的东西的,这样的好处是, ...

  8. CSS 设置鼠标显示形状

    CSS 设置鼠标显示形状 <style type="text/css"><!-- span {display:block;line-height:30px;mar ...

  9. HTML5: HTML5 表单属性

    ylbtech-HTML5: HTML5 表单属性 1.返回顶部 1. HTML5 表单属性 HTML5 新的表单属性 HTML5 的 <form> 和 <input>标签添加 ...

  10. HTML5: HTML5 表单元素

    ylbtech-HTML5: HTML5 表单元素 1.返回顶部 1. HTML5 表单元素 HTML5 新的表单元素 HTML5 有以下新的表单元素: <datalist> <ke ...