about.github.io/index.html at main · Cashass/about.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html>
<html lang="ru">

<head>
	<title>Методология БЭМ</title>
	<!-- <! Подключаем CSS> -->
	<link rel="stylesheet" href="css/style.css">
	<!-- <! Кодировка страницы> -->
	<meta http-equiv="Content type" content="text/html;charset=utf-8" />
</head>

<body>
	<!-- Создаем блок about -->
	<div class="about">
		<!-- Описываем ширину контента -->
		<div class="about__body">
			<!-- Разделяем на части -->
			<div class="about__header">
				<!-- Внутри header -->
				<div class="about__title title">ABOUT</div>
				<!-- Элемент -->
				<div class="about__text">
					Lorem ipsum dolor sit amet consectetur adipisicing elit. Non ipsa repudiandae debitis fuga necessitatibus
					veniam atque quam odit cum inventore? Similique adipisci qui quod, error quidem sapiente saepe possimus
					cum!
				</div>
			</div>
			<div class="about__row">
				<!-- Есть три колонки -->
				<div class="about__column">
					<div class="item-about">
						<div class="item-about__icon">
							<img src="img/about/01.png" alt="1">
						</div>
						<div class="item-about__title">WEB</div>
						<div class="item-about__text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae,
							quas?</div>
					</div>
				</div>
				<div class="about__column">
					<div class="item-about">
						<div class="item-about__icon">
							<img src="img/about/02.png" alt="2">
						</div>
						<div class="item-about__title">ios and Android</div>
						<div class="item-about__text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae,
							quas?</div>
					</div>
				</div>
				<div class="about__column">
					<div class="item-about">
						<div class="item-about__icon">
							<img src="img/about/03.png" alt="3">
						</div>
						<div class="item-about__title">Marketing</div>
						<div class="item-about__text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae,
							quas?</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>

</html>