Menu
CoddyTech
Bắt đầu học

Thêm biểu tượng

Bài học 6 trên 12 trong khóa học Dự án thanh điều hướng dưới cùng với HTML/CSS của Coddy.

challenge icon

Thử thách

Dễ

Trong mỗi thẻ danh sách <li>, hãy thêm biểu tượng tương ứng,

  1. Thêm vào danh sách trang chủ:

    <i class="fa-solid fa-house"></i>

  2. Thêm vào danh sách người dùng:

    <i class="fa-solid fa-user"></i>

  3. Thêm vào danh sách bảng điều khiển:

    <i class="fa-solid fa-rocket"></i>

  4. Thêm vào danh sách cuộc trò chuyện:

    <i class="fa-solid fa-people-group"></i>

  5. Thêm vào danh sách giỏ hàng:

    <i class="fa-solid fa-cart-shopping"></i>

Tự làm thử

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Viết code HTML tại đây -->
        <script src="script.js"></script>
    </body>
</html>

Tất cả bài học trong Dự án thanh điều hướng dưới cùng với HTML/CSS

1Thanh điều hướng

Thiết lập codemain-containerBài học dự ánThanh điều hướngBài học dự ánDanh sách không thứ tự và tiêu đềBài học dự ánMục danh sách và tiêu đềBài học dự ánThêm biểu tượngBài học dự án

2Phong cách

Thẻ phổ quátBài học dự ánThân trangBài học dự ánTạo kiểu thanh điều hướngBài học dự ánTạo kiểu danh sách không thứ tựBài học dự ánTạo kiểu mục danh sáchBài học dự ánHoạt ảnh biểu tượng khi di chuộtBài học dự án

Tự luyện tập: Playground Web