From 36907fcb621b1fbc2b1b0a266fde9eea78f06205 Mon Sep 17 00:00:00 2001
From: Julie <saganjules@gmail.com>
Date: Tue, 17 Dec 2024 10:43:25 +0200
Subject: [PATCH] Created image used srcset

---
 06-lection4/03-srcset/index.html | 33 ++++++++++++++++++++++++--------
 06-lection4/03-srcset/srcset.css |  5 +++++
 2 files changed, 30 insertions(+), 8 deletions(-)
diff --git a/06-lection4/03-srcset/index.html b/06-lection4/03-srcset/index.html
index 6d5ab43..6ac9fa3 100644
--- a/06-lection4/03-srcset/index.html
+++ b/06-lection4/03-srcset/index.html
@@ -1,10 +1,27 @@
 <!DOCTYPE html>
 <html lang="ru">
-    <head>
-        <link rel="stylesheet" href="../../assets/css/main.css">
-        <link rel="stylesheet" href="./srcset.css">
-    </head>
-    <body>
-
-    </body>
-</html>
+
+<head>
+    <link rel="stylesheet" href="../../assets/css/main.css">
+    <link rel="stylesheet" href="./srcset.css">
+
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Srcset</title>
+</head>
+
+<body>
+    <div class="image__wrapper">
+        <img src="./public/forest_400.jpg" alt="forest image" 
+        
+             srcset="
+             ./public/forest_400.jpg 400w,
+             ./public/forest_768.jpg 768w"
+         
+             sizes="
+             (max-width: 400px) 300px,
+             (max-width: 768px) 300px">
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/06-lection4/03-srcset/srcset.css b/06-lection4/03-srcset/srcset.css
index e69de29..aa12b40 100644
--- a/06-lection4/03-srcset/srcset.css
+++ b/06-lection4/03-srcset/srcset.css
@@ -0,0 +1,5 @@
+.image__wrapper {
+    width: 300px;
+    height: 300px;
+    overflow: hidden;
+}
\ No newline at end of file
