HTML_CSS_Practice/index.html at main · Dimitry-P/HTML_CSS_Practice · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="styles.css">
</head>

<body>
    <header class="header">
        <a class="header_logo"></a>
    </header>
    <main class="main">
        <h2 class="main_redTitle">What is Lorem Ipsum</h2>
        <h1 class="main_title">What is Lorem Ipsum</h1>
        <p class="main_text">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>
        <button class="main_btn">Help Me</button>
    </main>
    <div class="second">
        <section class="first_section">
            <h2 class="second_title">Services for you</h2><br>
            <h4 class="second_redTitle">Repair and maintenance</h4>
        </section>

        <section class="second_section">
            <div class="image1">
                <h4>Diagnosis and adjustment of the bike</h4>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text\</p>
            </div>
            <div class="image2">
                <h4>Diagnosis and adjustment of the bike</h4>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text</p>
            </div>
            <div class="image3">
                <h4>Diagnosis and adjustment of the bike</h4>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text</p>
            </div>
            <div class="image4">
                <h4>Diagnosis and adjustment of the bike</h4>
                <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text</p>
            </div>
        </section>
        <button class="second_button">Get discount 10%</button>
    </div>

    <div class="third">
        <h2 class="third_title">About Us</h2>
        <h4 class="third_blackTitle">We are a big family</h4>
        <h3 class="third_italicTitle">Company name</h3>
        <hr>
        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
            It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently
            with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
        <button class="third_button">Get discount 10%</button>
    </div>

    <div class="forth">
        <h2 class="contact_us">Contact Us</h2>
        <h4 class="forth_title">Leave a request</h4>
        <ul>
            <li><input type="text" class="input_one"></li>
            <li><input type="text" class="input_two"></li>
            <li><input type="text" class="input_three"></li>
            <li><button class="forth_button"></button></li>
        </ul>


        <div class="forth_right">
            <table>
                <tr>
                    <td><img src="images/ic_round-mail.png" alt=""></td>
                    <td class="forth_p_one">test@gmail.com</td>
                </tr>
                <tr>
                    <td><img src="images/ic_round-call.png" alt=""></td>
                    <td class="forth_p_two">(303) 555-0105</td>
                </tr>
                <tr>
                    <td><img src="images/ic_round-location-on.png" alt=""></td>
                    <td class="forth_p_three">2715 Ash Dr. San Jose, South Dakota 83475</td>
                </tr>
            </table>

        </div>
    </div>

    <footer>

    </footer>
</body>

</html>