finished up to bootstrap

This commit is contained in:
2026-01-01 23:38:59 +10:00
parent 9faac87716
commit 3f748ba05b
17 changed files with 378 additions and 1 deletions

34
lectures/lec3/task1.html Normal file
View File

@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Template</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
.col{
background: lightgray;
border: solid thin grey;
}
.row{
border: solid thin red;
}
</style>
</head>
<body class="container-fluid">
<div class="row m-2">
<div class="col-6 col-md-3 col-lg-2 h-2 p-3 bg-light"><h3>aboba</h3></div>
<div class="col-6 col-md-3 col-lg-2 h-2 p-3 bg-light"><h3>aboba</h3></div>
<div class="col-6 col-md-3 col-lg-2 h-2 p-3 bg-light"><h3>aboba</h3></div>
<div class="col-6 col-md-3 col-lg-2 h-2 p-3 bg-light"><h3>aboba</h3></div>
<div class="col-6 col-md-3 col-lg-2 h-2 p-3 bg-light"><h3>aboba</h3></div>
<div class="col-6 col-md-3 col-lg-2 h-2 p-3 bg-light"><h3>aboba</h3></div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</html>

38
lectures/lec3/task2.html Normal file
View File

@@ -0,0 +1,38 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Template</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
.col {
background: lightgray;
border: solid thin grey;
}
.row {
border: solid thin red;
}
</style>
</head>
<body>
<div class="container d-flex align-items end">
<h5 class="bg-light">Ворота на запад</h5>
<p>192-метровая арка в Сент-Луисе (штат Миссури, США)</p>
<img src="images/image1.jpg" alt="">
</div>
<div class="container d-grid justify-content-center">
<h5 class="bg-light">Ворота на запад</h5>
<p>192-метровая арка в Сент-Луисе (штат Миссури, США)</p>
<img src="images/image1.jpg" alt="">
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</html>

44
lectures/lec3/task3.html Normal file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap Template</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
.col {
background: lightgray;
border: solid thin grey;
}
.row {
border: solid thin red;
}
</style>
</head>
<body>
<div class="container"></div>
<div class="row p-2 border justify-content-between">
<div class="col-12 col-md-7 p-2 m-md-2 border bg-primary text-white">
Строка 1, столбец 1
</div>
<div class="col-12 col-md-3 p-2 m-md-2 border">
Строка 1, столбец 2
</div>
</div>
<div class="row p-2 border justify-content-between">
<div class="col-12 col-md-3 p-2 m-md-2 border">
Строка 2, столбец 1
</div>
<div class="col-12 col-md-7 bg-primary text-white col p-2 m-md-2 border">
Строка 2, столбец 2
</div>
</div>
</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</html>