Menu
CoddyTech
Bắt đầu học

Label

Bài học 14 trên 19 trong khóa học Bản sao trang đăng nhập Netflix | Dự án front-end của Coddy.

challenge icon

Thử thách

Dễ

Nhắm đến label trong lớp form-control:

  1. Đặt position thành absolute, cách bên trái 20 pixel và cách bên trên 50%.
  2. Đặt transform thành translateY(-50%)
  3. Đặt cỡ chữ thành 16px.
  4. Đặt pointers-event thành none.
  5. Đặt color thành #8c8c8c.
  6. Thêm transition: all 0.1s ease; vào cuố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 Bản sao trang đăng nhập Netflix | Dự án front-end

1Giới thiệu

Bạn sẽ tạo ra gì?

4CSS - II

NútBài học dự ánThay đổi nútBài học dự ánTô màu thêmBài học dự ánPhần dướiBài học dự án

2HTML

Thiết lập tiêu đề và phần baoTrường nhập liệu trong biểu mẫu IBài học dự ánTrường nhập liệu trong biểu mẫu IIBài học dự ánNútBài học dự ánVăn bảnBài học dự ánHoàn thiện HTMLBài học dự án

3CSS - I

Thẻ phổ quátBài học dự ánNavBài học dự ánLớp bao biểu mẫuBài học dự ánWrapper h2 và formBài học dự ánLớp điều khiển biểu mẫuBài học dự ánInputBài học dự ánLabelBài học dự ánHiệu ứng dịch chuyển khi focusBài học dự án

Tự luyện tập: Playground Web