响应式设计

Key Points:

CSS media queries, percentage widths, min or max widths heights

Learn Responsive Design

esponsive images, typography 排版, accessibility

Adaptive design

Adaptive design is creating an independent, lighter, and more streamlined mobile-optimized version of a website.

Responsive Image

<picture>
  <source srcset="image.avif" type="image/avif">
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="A description of the image." 
    width="300" height="200" loading="lazy" decoding="async">
</picture>

更新: 2023-08-14 11:48:16
原文: https://www.yuque.com/u3641/dxlfpu/gl05qyufst258gw2