otus--homework--08/index.html at master · Djess-V/otus--homework--08 · 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
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width= , initial-scale=1.0" />
    <title>Макет</title>
  </head>
  <body>
    <div class="container">
      <header class="header">
        <img class="header__image" src="./src/assets/cat.jpg" alt="Dogs" />
        <div class="header__description description-header">
          <h1 class="description-header__line">Incididunt proident anim.</h1>
          <h1 class="description-header__line">Incididunt proident anim.</h1>
          <h1 class="description-header__line">Incididunt proident anim.</h1>
          <h1 class="description-header__line">Incididunt proident anim.</h1>
        </div>
      </header>
      <aside class="aside-left">
        <p class="aside-left__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt sunt. Culpa excepteur deserunt officia fugiat et enim sint
          cupidatat.
        </p>
        <p class="aside-left__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt sunt. Culpa excepteur deserunt officia fugiat et enim sint
          cupidatat.
        </p>
      </aside>
      <main class="main">
        <div class="main__block main-block">
          <h2 class="main-block__title">Incididunt proident anim.</h2>
          <p class="main-block__description">
            Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
            cillum adipisicing exercitation minim mollit exercitation. Quis sit
            irure pariatur dolore qui voluptate quis culpa irure cillum.
            Cupidatat nostrud pariatur Lorem quis laborum
          </p>
        </div>
        <div class="main__block main-block">
          <h2 class="main-block__title">Incididunt proident anim.</h2>
          <p class="main-block__description">
            Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
            cillum adipisicing exercitation minim mollit exercitation. Quis sit
            irure pariatur dolore qui voluptate quis culpa irure cillum.
            Cupidatat nostrud pariatur Lorem quis laborum
          </p>
        </div>
        <div class="main__block main-block">
          <h2 class="main-block__title">Incididunt proident anim.</h2>
          <p class="main-block__description">
            Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
            cillum adipisicing exercitation minim mollit exercitation. Quis sit
            irure pariatur dolore qui voluptate quis culpa irure cillum.
            Cupidatat nostrud pariatur Lorem quis laborum
          </p>
        </div>
        <div class="main__block main-block">
          <h2 class="main-block__title">Incididunt proident anim.</h2>
          <p class="main-block__description">
            Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
            cillum adipisicing exercitation minim mollit exercitation. Quis sit
            irure pariatur dolore qui voluptate quis culpa irure cillum.
            Cupidatat nostrud pariatur Lorem quis laborum
          </p>
        </div>
      </main>
      <aside class="aside-right">
        <p class="aside-right__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt sunt. Culpa excepteur deserunt officia fugiat et enim sint
          cupidatat.Quis sit irure pariatur dolore qui voluptate quis culpa
          irure cillum. Cupidatat nostrud pariatur Lorem quis laborum
          exercitation duis exercitation ea incididunt sunt. Culpa excepteur
          deserunt officia fugiat et enim sint cupidatat.
        </p>
      </aside>
      <footer class="footer">
        <p class="footer__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt.
        </p>
        <p class="footer__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt.
        </p>
        <p class="footer__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt.
        </p>
        <p class="footer__paragraph">
          Cupidatat laboris in veniam esse. Nisi ipsum tempor cillum do ipsum
          cillum adipisicing exercitation minim mollit exercitation. Quis sit
          irure pariatur dolore qui voluptate quis culpa irure cillum. Cupidatat
          nostrud pariatur Lorem quis laborum exercitation duis exercitation ea
          incididunt.
        </p>
      </footer>
    </div>
  </body>
</html>