响应式元素和Media

Resizing an image using percent width 使用百分宽度来调整图片大小

img.responsive {
    max-width: 100%;
    height: auto;
}

Responsive images using the cookie and JavaScript 使用cookie和JavaScript来做响应式图片

document.cookie = 'screen_dimensions=' + screen.width + 'x' + screen.height;

请求图片的时候，带着cookie传给服务器

Making your video respond to your screen width 使视频响应式

Resizing an image using media queries 使用媒体查询来做图片响应式

@media screen and ( max-width: 1024px ) {
    img.responsive { width: 200px }
}
@media screen and ( min-width: 1025px ) and ( max-width: 1280px ) {
    img.responsive { width: 300px }
}

Changing your navigation with media queries 使用媒体查询改变导航

Making a responsive padding based on size 依据大小制造一个响应式填充

Making a CSS3 button glow for a loading element