commit b72524adf05b4e3c3d0dbbf02c8a3598c3364af9 Author: anzorzakriev Date: Wed Mar 15 23:50:44 2023 +0300 блочная верстка с использованием float(clear:both) diff --git a/images/3601321.jpg b/images/3601321.jpg new file mode 100644 index 0000000..e7ff473 Binary files /dev/null and b/images/3601321.jpg differ diff --git a/images/Background.png b/images/Background.png new file mode 100644 index 0000000..c044a70 Binary files /dev/null and b/images/Background.png differ diff --git a/images/Burger.png b/images/Burger.png new file mode 100644 index 0000000..3a61bba Binary files /dev/null and b/images/Burger.png differ diff --git a/images/Burger1.png b/images/Burger1.png new file mode 100644 index 0000000..58e058d Binary files /dev/null and b/images/Burger1.png differ diff --git a/images/Layer 3.png b/images/Layer 3.png new file mode 100644 index 0000000..84ad47d Binary files /dev/null and b/images/Layer 3.png differ diff --git a/images/Sauce (1).png b/images/Sauce (1).png new file mode 100644 index 0000000..3d9f11b Binary files /dev/null and b/images/Sauce (1).png differ diff --git a/images/Sauce.png b/images/Sauce.png new file mode 100644 index 0000000..3d9f11b Binary files /dev/null and b/images/Sauce.png differ diff --git a/images/Vector Smart Object2.png b/images/Vector Smart Object2.png new file mode 100644 index 0000000..90a5183 Binary files /dev/null and b/images/Vector Smart Object2.png differ diff --git a/images/action.png b/images/action.png new file mode 100644 index 0000000..a971261 Binary files /dev/null and b/images/action.png differ diff --git a/images/car.png b/images/car.png new file mode 100644 index 0000000..d815c3b Binary files /dev/null and b/images/car.png differ diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 0000000..5c2c98d Binary files /dev/null and b/images/logo.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..62004a3 --- /dev/null +++ b/index.html @@ -0,0 +1,102 @@ + + + + + + + + + Food menu + + + +
+ +
+
+ +
+
+ EXPRESS DELIVERY +
+ +1 234 567 890 +
+
+ +
+
+ +
+
+
+
  • BURGERS
    • +
  • Lorem ipsum dolor.........................10$
    • +
  • Duis aute irure.........................10$
    • +
  • Excepteur sint occaecat.........................10$
    • +
  • consectetur adipiscing elit.........................10$
    • +
  • reprehenderit in voluptate.........................10$
    • +
  • nostrud exercitation.........................10$
    • +
  • Ut enim.........................10$
    • +
  • Spinach Artichoke Dip.........................10$
    • +
    +
    +
  • DRINKS
    • +
  • Lorem ipsum dolor.........................10$
    • +
  • Duis aute irure.........................10$
    • +
  • Excepteur sint occaecat.........................10$
    • +
  • consectetur adipiscing elit.........................10$
    • +
  • reprehenderit in voluptate.........................10$
    • +
  • nostrud exercitation.........................10$
    • +
  • Ut enim.........................10$
    • +
  • Spinach Artichoke Dip.........................10$
    • +
    +
    +
    + + +
    +
    +
  • DESSERTS
    • +
  • Lorem ipsum dolor.........................10$
    • +
  • Duis aute irure.........................10$
    • +
  • Excepteur sint occaecat.........................10$
    • +
  • consectetur adipiscing elit.........................10$
    • +
  • reprehenderit in voluptate.........................10$
    • +
  • nostrud exercitation.........................10$
    • +
  • Ut enim.........................10$
    • +
  • Spinach Artichoke Dip.........................10$
    • +
    +
    + It is a good time for the great taste of burgers
    + BURGER
    + WEEK
    +
    + +
    +
    + $5.49
    + Only +
    +
    +
    +
    + +
    +
    +
    + + Spicy Availaable +
    +
    + info@yoursite.com // wwww.yoursite.com,
    + Main Road, Building Name, Country +
    +
    +
    + +
    + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..266571d --- /dev/null +++ b/style.css @@ -0,0 +1,257 @@ +*{ + margin: 0px; + padding: 0px; + box-sizing: border-box; +} +body{ + font-family: Geneva, Arial, Helvetica, sans-serif; +} +.container{ + width: 980px; + margin: 0 auto; + height: auto; + background-image: url(images/Background.png); + background-size: cover; + position: relative; + overflow: hidden; +} +.logo{ + float: left; +} +.logo img{ + padding: 50px 0px 0px 40px;; + width: 300px; + height: 90pd; +} +.plashka{ + float: right; + background-color: #bf2121; + width: 360px; + padding: 15px 0px 15px 30px; + margin-top:40px; + z-index: 1; + +} + +.plashka-item-1 img{ + float: left; + padding-top: 6px; + width: 40px; + height: 44px; +} +.plashka-item-2{ + float:left; + padding-left: 15px; +} +a{ + text-decoration: none; + color: white; + +} +.slogan{ + font-size: 12px; + color: #fff; + font-weight: 500; + +} +.phone{ + font-size: 30px; + color: #fff; + font-weight: 600; + +} +.clear{ + clear: both; +} +.burger-image img{ + display: block; + margin: auto; + width: 14%; + height: 14%; + -webkit-filter: drop-shadow(10px 15px 15px #a07001); + filter: drop-shadow(10px 15px 15px #a07001); +} +.section-1{ + margin-top: -10px; +} +.section-2{ + margin-top: 90px; +} +.menu-1{ + margin-left: 40px; + float: left; + +} +.menu-2{ + margin-right: 40px; + float: right; +} +.menu-3{ + margin-right: 40px; + float: right; +} + +li{ + list-style:none; + padding: 10px 0px; + } +span{ + padding:15px 10px; + text-transform: uppercase; + font-size: 16px; + font-weight: 500; +} +a{ + color: black; +} +.title{ + font-size: 27px; + font-weight: 700; +} +.botl{ + position: absolute; + top: 630px; + left: 400px; + width: 130px; + height: 200px; + transform: rotate(-10deg); + -webkit-filter: drop-shadow(10px 15px 15px #a07001); + filter: drop-shadow(10px 15px 15px #a07001); + +} +.souse{ + position: absolute; + top: 630px; + left: 880px; + width: 130px; + height: 130px; + -webkit-filter: drop-shadow(10px 15px 15px #a07001); + filter: drop-shadow(10px 15px 15px #a07001); +} +.menu-3{ + position: relative; + margin-top: 90px; + padding: 30px 40px 20px 40px; + float:right; + text-align: right; +} +.text{ + font-size: 9px; + padding: 5px 5px; + border: 1px dashed #000; + stroke-dasharray: 3; + text-align: left; + text-transform: uppercase; + +} +.burger-week{ + font-size: 60px; + font-weight: 900; + line-height:60px; + color: #3d2513; + text-shadow:1px 2px 0px #fee8bc; + +} +.week{ + font-size: 40px; + font-weight: 900; + color: #3d2513; + text-shadow:1px 2px 0px #fee8bc; + +} +.burger-action{ + float: right; +} +.burger-action-img{ + position: absolute; + float: right; + left: 18px; + top: 165px; + -webkit-filter: drop-shadow(-30px -30px 40px #fee8bc); + filter: drop-shadow(-30px -30px 46px #fee8bc); +} +.price{ + position: absolute; + top: 320px; + left: 40px; + width: 100px; + height: 100px; + border-radius:100%; + background-color: #bf2121; + +} +.price-m{ + margin:5px; + padding:20px; + width: 90px; + height: 90px; + border-radius:100%; + background-color: #bf2121; + border: 2px dashed #fff; + text-align: center; + +} +.price-m-item-1{ + font-size: 25px; + font-weight: 700; + color: #fff; +} +.price-m-sub{ + font-size: 14px; + font-weight: 700; + color: #fff; +} +.price-m-item-2{ + text-transform: uppercase; + font-weight: 600; + color: #fff; + letter-spacing:2px; +} +.burger-image-clone{ + position: absolute; + top: 1040px; + left: -44px; + width: 100px; + height: 100px; +} +.footer-line{ + float: left; +} +.spicy{ + position: relative; + margin:100px 0px 0px 70px; + width: 280px; + height: 30px; + background-color: #3d2513; + border-radius: 3px; +} +.spicy-img{ + position: absolute; + text-align: center; + top: -28px; + left: -23px; + width: 50px; + height: 60px; +} +.spicy-text{ + display: inline-block; + padding: 5px 5px 5px 50px; + text-align: center; + text-transform: uppercase; + font-size: 16px; + font-weight: 500; + color: #ffffff; + line-height: 21px; + letter-spacing: 0.2em; + +} +.address{ + margin: 30px 0px 40px 70px; +} +.address a{ + display: inline-block; + font-size: 12px; + font-weight: 600; + text-transform: uppercase; +} +