<picture>

  <source media="(min-width: 1000px)" srcset="kookaburra_large_1x.jpg 1x, kookaburra_large_2x.jpg 2x">

  <source media="(min-width: 500px)" srcset="kookaburra_medium_1x.jpg 1x, kookaburra_medium_2x.jpg 2x">

  <img src="kookaburra_small.jpg" alt="The kookaburra: a terrestrial tree kingfisher native to Australia and New Guinea">

</picture>

http://udacity.github.io/responsive-images/examples/3-08/pictureFullMonty/

[CSS3] The picture element的更多相关文章

  1. A Complete Guide to the <Picture> Element

    If you’ve ever struggled building responsive websites, this post is for you. It’s part of a series o ...

  2. 【转】像素 Pixel (Picture Element)

    原文链接:https://blog.csdn.net/zssureqh/article/details/78768942 1.像素Pixel 讲到概念,首选Wiki百科.当然我说的是英文版Pixel ...

  3. [CSS3] Define Form Element States with CSS Form Pseudo Classes

    Using just semantic CSS Pseudo-Classes you can help define important states for form elements that e ...

  4. CSS3基础入门02

    CSS3 基础入门02 边框相关属性 border-radius 通过这个属性我们可以设置边框圆角,即可以将四个角设置为统一的圆角,也可以单独的设置具体的某一个角的圆角. grammer: borde ...

  5. 第四章 CSS3概述

    1.CSS3新增常用选择器(1)结构性伪类选择器:root 文档根元素 :nth-child(n) 第N个子元素"first-child 第一个元素 :kast-child 最后一个子元素 ...

  6. CSS3常用选择器

    一.基本选择器 子元素选择器 概念:子元素选择器只能选择某元素的子元素语法格式:父元素 > 子元素 (Father > Children)兼容性:IE8+.FireFox.Chrome.S ...

  7. 转载：轻量级浏览器特性检测库：feature.js

    feature.js是一个很简单.快速和轻量级的浏览器特性检测库,它没有任何依赖,体积压缩最后只有1KB,它可以自动初始化,在你需要知道某个特性是否可用时,直接引入即可.以下中文为个人理解. /*! ...

  8. HTML5之图片在Retina屏的常用几种处理方式

    Media Queries使用css3的媒体查询实现高清屏的图片处理. @media only screen and (-webkit-min-device-pixel-ratio: 1.5), on ...

  9. 现代3D图形编程学习-基础简介(2) (译)

    本书系列 现代3D图形编程学习 基础简介(2) 图形和渲染 接下去的内容对渲染的过程进行粗略介绍.遇到的部分内容不是很明白也没有关系,在接下去的章节中,会被具体阐述. 你在电脑屏幕上看到的任何东西,包 ...

随机推荐

  1. wordpress迁移以及遇到的一些问题[mysql备份导入导出][固定链接404]

    总的问题有两个,一是apache的配置,二是mysql的导出和导入.以及迁移后遇到的一些问题解决过程和方法. A机器为老server.B为新server,A机器使用Appserv,B使用wmap,在配 ...

  2. RabbitMQ从入门到精通

    RabbitMQ从入门到精通 学习了:http://blog.csdn.net/column/details/rabbitmq.html RabbitMQ是AMQP(advanced message ...

  3. C# DispatcherTimer Start之后立即执行

    如果DispatherTimer 的Interval 不是在实例化时赋值,那么Start之后,Tick方法会立即执行一次. DispatcherTimer timer = new Dispatcher ...

  4. 初识cocos2dx——入门第一篇

    享受"啪"的按下Enter的快感. (by云风) cocos2dx是不是个toy引擎,不同的人有不同的看法.可是你不得不承认它非常受欢迎.好多非常火的手游使用的就是cocos2dx ...

  5. zzulioj--1613--少活一年？（稍微有点坑，水！）

    1613: 少活一年? Time Limit: 1 Sec  Memory Limit: 128 MB Submit: 344  Solved: 70 SubmitStatusWeb Board De ...

  6. Java-杂项：Java数组Array和集合List、Set、Map

    ylbtech-Java-杂项:Java数组Array和集合List.Set.Map 1.返回顶部 1. 之前一直分不清楚java中的array,list.同时对set,map,list的用法彻底迷糊 ...

  7. filezilla的root账户无法连接服务器解决办法

    lz一直都是用filezilla上传文件到vm虚拟机的,用的是ubuntu14.04的系统.最近自己重新搭了lamp去做thinkphp的学习,lz有两个账户,一个是kin,另外一个是root.大家都 ...

  8. python初始面向对象

    阅读目录 楔子 面向过程vs面向对象 初识面向对象 类的相关知识 对象的相关知识 对象之间的交互 类命名空间与对象.实例的命名空间 类的组合用法 初识面向对象小结 面向对象的三大特性 继承 多态 封装 ...

  9. C#中显现串口通信SerialPort类

    SerialPort类的常用属性 名 称 说 明 BaseStream 获取 SerialPort 对象的基础 Stream 对象 BaudRate 获取或设置串行波特率 BreakState 获取或 ...

  10. Android Studio 插件 GsonFormat ：你还在烦恼 为 Json格式 生成 JavaBean实体类吗？

    在网络层,互联网提供所有应用程序都要使用的两种类型的服务,尽管目前理解这些服务的细节并不重要,但在所有TCP/IP概述中,都不能忽略他们: 无连接分组交付服务(Connectionless Packe ...