picture元素

http://www.w3cplus.com/responsive/responsive-images-101-part-6-picture-element.html

CHAPTER 1
Introduction 1
Web standards: friend or foe? 2
Web 标准是友是敌？
http://www.w3cplus.com/css3/css-secrets/web-standards-friend-or-foe.html
CSS coding tips
CSS 编码技巧
http://www.w3cplus.com/css3/css-secrets/css-coding-tips.html

CHAPTER 2
Backgrounds & Borders
1 Translucent borders
透明边框
http://www.w3cplus.com/css3/css-secrets/translucent-borders.html
2 Multiple borders
多边框
http://www.w3cplus.com/css3/css-secrets/multiple-borders.html
3 Flexible background positioning
灵活的背景定位
http://www.w3cplus.com/css3/css-secrets/flexible-background-positioning.html
4 Inner rounding
内凹圆角
http://www.w3cplus.com/css3/css-secrets/inner-rounding.html
5 Striped backgrounds
条纹背景
http://www.w3cplus.com/css3/css-secrets/striped-backgrounds.html
6 Complex background patterns 50
复杂背景图案
http://www.w3cplus.com/css3/css-secrets/complex-background-pattern.html
7 (Pseudo)random backgrounds 62
随机背景
http://www.w3cplus.com/css3/css-secrets/random-backgrounds.html
8 Continuous image borders 68
图片边框
http://www.w3cplus.com/css3/css-secrets/continuous-image-borders.html

CHAPTER 3
Shapes 75
9 Flexible ellipses 76
灵活的椭圆形
http://www.w3cplus.com/css3/css-secrets/flexible-ellipses.html
10 Parallelograms 84
平行四边形
http://www.w3cplus.com/css3/css-secrets/parallelograms.html
11 Diamond images 90
菱形图片
http://www.w3cplus.com/css3/css-secrets/diamond-images.html
12 Cutout corners 96
斜切角
http://www.w3cplus.com/css3/css-secrets/cutout-corners.html
13 Trapezoid tabs 108
梯形标签
http://www.w3cplus.com/blog/1658.html
14 Simple pie charts 114

CHAPTER 4
Visual Effects 129
15 One-sided shadows 130
单面阴影
http://www.w3cplus.com/css3/css-secrets/one-sided-shadows.html

16 Irregular drop shadows 134
不规则的阴影
http://www.w3cplus.com/css3/css-secrets/Irregular-drop-shadows.html
17 Color tinting 13
色调
http://www.w3cplus.com/css3/css-secrets/color-tinting.html
18 Frosted glass effect 146
磨砂玻璃效果
http://www.w3cplus.com/css3/css-secrets/frosted-glass-effect.html
19 Folded corner effect 156
折角效果
http://www.w3cplus.com/css3/css-secrets/folded-corner-effect.html

CHAPTER 5
Typography 167
20 Hyphenation 168
断字
http://www.w3cplus.com/css3/css-secrets/hyphenation.html
21 Inserting line breaks 172
插入换行符
http://www.w3cplus.com/css3/css-secrets/inserting-line-breaks.html
22 Zebra-striped text lines 178

23 Adjusting tab width 182
调整tab缩进宽度
http://www.w3cplus.com/css3/css-secrets/adjusting-tab-width.html
24 Ligatures 184
连体字母
http://www.w3cplus.com/css3/css-secrets/ligatures.html
25 Fancy ampersands 188
花式的&符号
http://www.w3cplus.com/css3/css-secrets/fancy-ampersands.html
26 Custom underlines 194
自定义下划线
http://www.w3cplus.com/css3/css-secrets/custom-underlines.html
27 Realistic text effects 200
逼真的文本效果
http://www.w3cplus.com/css3/css-secrets/realistic-text-effects.html
28 Circular text 210
环形文本
http://www.w3cplus.com/css3/css-secrets/circular-text.html

CHAPTER 6
User Experience 217
29 Picking the right cursor 218
挑选合适的光标
http://www.w3cplus.com/css3/css-secrets/picking-the-right-cursor.html
30 Extending the clickable area 224
扩展可点击区域
http://www.w3cplus.com/css3/css-secrets/extending-the-clickable-area.html

31 Custom checkboxes 228
自定义复选框
http://www.w3cplus.com/css3/css-secrets/custom-checkboxes.html
32 De-emphasize by dimming 234
通过亮度调节去强调（De-emphasize）
http://www.w3cplus.com/css3/css-secrets/de-emphasize-by-dimming.html
33 De-emphasize by blurring 240
通过模糊来De-emphasize（去强调）
http://www.w3cplus.com/css3/css-secrets/de-emphasize-by-blurring.html
34 Scrolling hints 244
滚动提示
http://www.w3cplus.com/css3/css-secrets/scrolling-hints.html
35 Interactive image comparison 250
交互式图像对比
http://www.w3cplus.com/css3/css-secrets/interactive-image-comparison.html

CHAPTER 7
Structure & Layout 261
36 Intrinsic sizing 262
内容尺寸
http://www.w3cplus.com/css3/css-secrets/intrinsic-sizing.html
37 Taming table column widths
驾驭列表宽度
http://www.w3cplus.com/css3/css-secrets/taming-table-column-widths.html
38 Styling by sibling count 270
相邻元素样式
http://www.w3cplus.com/css3/css-secrets/styling-by-sibling-count.html
39 Fluid background, ?xed content 276
流体背景，固定内容
http://www.w3cplus.com/css3/css-secrets/fluid-background-fixed-content.html
40 Vertical centering 280
垂直居中
http://www.w3cplus.com/css3/css-secrets/vertical-centering.html
41 Sticky footers 288
http://www.w3cplus.com/css3/css-secrets/sticky-footers.html

CHAPTER 8
Transitions & Animations 293
42 Elastic transitions 294
灵活的过渡
http://www.w3cplus.com/css3/css-secrets/elastic-transitions.html
43 Frame-by-frame animations 308
逐帧动画
http://www.w3cplus.com/css3/css-secrets/frame-by-frame-animations.html
44 Blinking 314
闪烁动画
http://www.w3cplus.com/css3/css-secrets/blinking.html
45 Typing animation 320
文本动画
http://www.w3cplus.com/css3/css-secrets/typing-animation.html
46 Smooth state animations 328
动画状态
http://www.w3cplus.com/css3/css-secrets/smooth-state-animations.html
47 Animation along a circular path 334
CSS秘密花园： 沿着路径的动画
http://www.w3cplus.com/css3/css-secrets/animation-along-a-circular-path.html
环形文本
http://www.w3cplus.com/css3/css-secrets/circular-text.html

css秘密花园