1. 程式人生 > >根據屏幕大小,加載不同大小的圖片

根據屏幕大小,加載不同大小的圖片

clas con blog dev tee htm -c script log

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>Document</title>
    <script>
        document.createElement( "picture" );
       </script>
</head
> <body> <picture> <source srcset="pic1.png" media="(max-width: 600px)"> <source srcset="pic2.png" media="(max-width: 800px)"> <img srcset="pic3.png" alt="pic"> </picture> </body> </html>

根據屏幕大小,加載不同大小的圖片