<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. POJ 1777

    一道好题. 由算术基本定理,知: 那么,对于上式的每个因子值只能是2^M的形式.取第一个式子为例,通过分解因式出(1+p^2)=2^k知,a只能为1. 于是对于p只能是梅森素数.而且每个梅森素数只能出 ...

  2. Mysql 奇怪的连接错误

    今天,碰到了一个数据库连接问题: 不像之前在linux上mysql连接问题,那是权限设置.而这次问题的起源是: 我想要往mysql导入csv文件,可是因为文件比較大.有88M数据:使用navicatc ...

  3. HDU 4912 lca贪心

    Paths on the tree Time Limit: 4000/2000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Othe ...

  4. （转）c++ typedef 函数指针详细说明

    转自:http://blog.csdn.net/future200x/article/details/5350134 一个函数在编译时被分配一个入口地址,将这个入口地址称为函数的指针,可以用一个指针变 ...

  5. edit filter rules in sql source control

    https://documentation.red-gate.com/soc6/common-tasks/exclude-objects-using-filters 如果有人上传了filter,nam ...

  6. Java悲观锁和乐观锁

    悲观的并发策略——Synchronized互斥锁 互斥锁是最常见的同步手段,在并发过程中,当多条线程对同一个共享数据竞争时,它保证共享数据同一时刻只能被一条线程使用,其他线程只有等到锁释放后才能重新进 ...

  7. Java Servlet 配置

    图片太大,可以右键另存再查看,也可以鼠标点击拖置一下,用浏览器单独承载放大查看.

  8. PHP分页组件：Paginator

    安装 composer require "jasongrimes/paginator:~1.0" 使用 <?php require '../vendor/autoload.p ...

  9. POJ 3624 Charm Bracelet【01背包】

    解题思路:直接套公式就能做的01背包, for(i=1;i<=n;i++) { for(v=w[i];v<=m;v++) f[i,v]=max(f[i,v],f[i-1,v-w[i]]+d ...

  10. 自定义一个简单的web框架

    from wsgiref.simple_server import make_server def book(request):     #视图函数 return [b'<h1> book ...