Code Contact Form và Footer - Phần 2

Dẫn nhập

Ở bài học trước chúng ta đã cùng nhau code xong phần HTML CONTACT FORM SECTION.

Trong bài học này chúng ta sẽ tiếp tục code CSS cho Contact Form và Section.

Nội dung 

Để đọc hiểu bài này tốt nhất, bạn nên xem qua các nội dung: 

• TỔNG QUAN HTML CƠ BẢN
• TỔNG QUAN CSS CƠ BẢN
• CẤU TRÚC MODEL BOX TRONG CSS
• SET UP FILE HTML & CSS
• CODING HEADER – PHẦN 1
• CODING HEADER – PHẦN 2
• CODING HEADER – PHẦN 3
• CODING ABOUT SECTION CHO WEB LANDINGPAGE - PHẦN 1
• CODING ABOUT SECTION CHO WEB LANDINGPAGE - PHẦN 2 
• PRODUCTS SECTION CHO WEB LANDINGPAGE
• TESTIMONIALS SECTION.
• SPONSORS SECTION.
• HTML CONTACT FORM SECTION

Trong bài này, Kteam sẽ cùng bạn tìm hiểu nội dung:

• Code CSS

Code CSS

   .information{
    list-style: none;
    color: white;
    line-height: 200%;
    margin-top: 70px;
    word-spacing: 1px;
    font-size: 95%;
}
 
.information .small-icon{
    color: #427db4
}
 
.information .small-icon:hover,
.information .small-icon:active{
    transform: scale(1.3);
}
 
.social-icons{
    margin-top: 50px;
    list-style: none;
}
 
.social-icons li{
    display: inline-block;
    font-size: 250%;
    margin-left: 20px;
    color: white;
}
 
.social-icons li i{
    transition: all .3s;
    cursor: pointer;
}
 
.social-icons li i:hover,
.social-icons li i:active{
    transform: scale(1.3);
    color: #e67e22;
}
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

Kết luận

Ở bài này chúng ta đã cùng nhau code xong phần HTML của Contact Form Section và Footer.

Ở bài sau chúng ta sẽ đi tiếp vào phần HOÀN THIỆN CSS CỦA CONTACT FORM và bắt đầu code Responsive.

Cảm ơn các bạn đã theo dõi bài viết. Hãy để lại bình luận và góp ý của mình để giúp phát triển bài viết tốt hơn. Đừng quên: "Luyện tập – Thử thách – Không ngại khó".

---

Tải xuống

Tài liệu

Nhằm phục vụ mục đích học tập Offline của cộng đồng, Kteam hỗ trợ tính năng lưu trữ nội dung bài học Code Contact Form và Footer - Phần 2 dưới dạng file PDF trong link bên dưới.

Ngoài ra, bạn cũng có thể tìm thấy các tài liệu được đóng góp từ cộng đồng ở mục TÀI LIỆU trên thư viện Howkteam.com

Đừng quên like và share để ủng hộ Kteam và tác giả nhé!

Project

Nếu việc thực hành theo hướng dẫn không diễn ra suôn sẻ như mong muốn. Bạn cũng có thể tải xuống PROJECT THAM KHẢO ở link bên dưới!

Thảo luận

Nếu bạn có bất kỳ khó khăn hay thắc mắc gì về khóa học, đừng ngần ngại đặt câu hỏi trong phần BÌNH LUẬN bên dưới hoặc trong mục HỎI & ĐÁP trên thư viện Howkteam.com để nhận được sự hỗ trợ từ cộng đồng.

CỘNG ĐỒNG HỎI ĐÁP HOWKTEAM.COM

GROUP THẢO LUẬN FACEBOOK