Css darsliklari

Download 0.98 Mb.
bet	7/7
Sana	08.06.2023
Hajmi	0.98 Mb.
	#70993

1 2 3 4 5 6 7

Bog'liq
CSS
15, баён кирилда, Samatov, SHAMSIDDINOV ISAQJON, KT Laboratoriya ishi 4, 4-7-lab S.T, Заголовок отчета, mobiledan manga tushga test, loyiha ishi 2 cmestir, add, 4 Amaliy ish Operatsion tizimda Windows OT parolga asoslangan autentifikatsiya, 4.10, Fizika” fani bo’yicha, Ulugʻbek.M Akademik yozuv Reklama matni mustaqil ta\'lim 2, 1-Amaliyot ishi

Dastur natijasi

Loyha

Dastur kodi:
Html
DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Task 4title>
<link rel="stylesheet" href="css/stayle4.css">
head>

<body>
<div class="menyu">
<div class="container">
<div class="top">
<div class="box">
<img src="/4 1.jpg" alt="">
<div class="malumot">
<h1>Orginalh1>
<i>Tomato sauce, mozzarella & oregano i>
<h4>$18.00h4>
<button>ADD TO CARTbutton>
div>

div>
div>
<div class="top">
<div class="box">
<img src="/4 2.jpg" alt="">
<div class="malumot">
<h1>Salamih1>
<i>Tomato sauce, mozzarella & mild i>
<h4>$15.00h4>
<button>ADD TO CARTbutton>
div>

div>
div>

div>
<div class="container2">
<div class="top">
<div class="box">
<img src="/4 3.jpg" alt="">
<div class="malumot">
<h1>Chickenh1>
<i>Tomato sauce, mozzarella,chicken,pineapple*& bbq saui>
<h4>$25.00h4>
<button>ADD TO CARTbutton>
div>

div>
div>
<div class="top">
<div class="box">
<img src="/4 4.jpeg" alt="">
<div class="malumot">
<h1>Hawaiianh1>
<i>Tomato sauce, mozzarella, ham & pineapple i>
<h4>$16.00h4>
<button>ADD TO CARTbutton>
div>

div>
div>

div>
div>
body>

html>

Css
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: sans-serif;
}
.menyu{
width: 100vw;
height: 100vh;
background-color: rgb(191, 188, 188);
align-items: center;
justify-content: center;

}
.container {
width: 1200px;
height: 280px;
display: flex;
justify-content:space-evenly;
align-items: center;
}
.container2{
width: 1200px;
height: 300px;
display: flex;
justify-content: space-evenly;
align-items: center;
}

img {
width: 240px;
height: 230px;
}

.box {
width: 550px;
height: 270px;
display: flex;
justify-content: center;
align-items: center;
padding: 10px 30px;
background-color: white;
}

.malumot {
margin: 20px;
}

h1 {
font-weight: 500;
margin-bottom: 20px;
}

h4 {
color: rgba(186, 21, 21, 0.689);
margin: 15px 0;
}

button {
padding: 10px 20px;
border: none;
}

Dastur natijasi:

Download 0.98 Mb.

1 2 3 4 5 6 7

Download 0.98 Mb.