Code Contact Form và Footer - Phần 1

<footer>
    <p>
        Copyright &copy; 2018 by SELFTAUGHT TEAM
    </p>
</footer>
1
2
3
4
5

<section class="contact-section">
    <div class="row">
        <div class="col span-1-of-3">
            <ul class="information">
                <li><i class="fas fa-map-marker-alt"></i>Address: 21A, SelfTaught street, Ha Noi</li>
                <li><i class="fas fa-envelope"></i>Email: selftaughtteam@edu.com</li>
                <li><i class="fas fa-phone"></i>SĐT: (+084 )099-923-232-320</li>
            </ul>
            <ul class="social-icons">
                <li><i class="fab fa-facebook"></i></li>
                <li><i class="fab fa-twitter-square"></i></li>
                <li><i class="fab fa-instagram"></i></li>
                <li><i class="fab fa-google-plus-square"></i></li>
            </ul>
        </div>
        <div class="col span-2-of-3">
           <form>
               <div class="row">
                   <div class="col span-1-of-3">
                        <label>Name</label>
                   </div>
                   <div class="col span-2-of-3">
                        <input type="text" placeholder="Your Name">
                   </div>
               </div>
               <div class="row">
                   <div class="col span-1-of-3">
                        <label>Email</label>
                   </div>
                   <div class="col span-2-of-3">
                        <input type="email" placeholder="Your Email">
                   </div>
               </div>
               <div class="row">
                   <div class="col span-1-of-3">
                        <label>Message</label>
                   </div>
                   <div class="col span-2-of-3">
                        <textarea  placeholder="Your Message"></textarea>
                   </div>
               </div>
               <div class="row">
                   <input type="submit" class="btn" value="Send It">
               </div>
           </form>
        </div>
    </div>
 </section>
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

/* ------------------------------------- */
/* ---------FOOTER------------------- */
/* ---------------------------------- */
footer{
    text-align: center;
    background-color: #494949;
    color: white;
    padding: 20px;
}
1
2
3
4
5
6
7
8
9
10

/* ---------------------------------- */
/* ----------CONTACT FORM------------- */
/* ------------------------------------------- */
.contact-section{
    background-image: linear-gradient(45deg,rgba(2,33,64, 0.8) 55%,rgba(45,95,93,0.85)),url('../img/background5.jpeg');
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
1
2
3
4
5
6
7
8
9
10