💡 Tôi đã chuẩn bị sẵn trình soạn thảo bên dưới bài viết. Bạn có thể thử nghiệm thoải mái!

Cập nhật: 2025年3月1日

Chiều rộng (Width)

📌

Kết luận

Dùng width để xác định chiều rộng của phần tử

📝 Mã thực tế tại đây
div { width: 300px; }

Lựa chọn đơn vị

Đơn vịĐặc điểmTrường hợp sử dụng
pxGiá trị cố địnhCác thành phần có kích thước không đổi
%Tỷ lệ so với phần tử chaThiết kế Responsive (co giãn)
vwChiều rộng màn hìnhGiao diện toàn màn hình

Tổng kết

- width xác định chiều rộng cố định (chiều cao dùng height) - Dùng % hoặc vw cho các thiết kế cần co giãn theo màn hình

Hãy thử trong phần bài tập

Hãy đặt chiều rộng của thẻ div là 300px nhé.

🧪 Thử nghiệm tại đây

Bạn có thể viết mã thực tế vào trình soạn thảo bên dưới và xem ngay kết quả. Đừng sợ làm hỏng, bạn có thể thử lại bao nhiêu lần tùy thích.

Thử ngay

■ Bài tập thực hành

Hãy đặt chiều rộng của thẻ div là 300px.

Gợi ý khi gặp khó khăn

width: 300px;

10pt

Chiều rộng (Width)

Hãy đặt chiều rộng của thẻ div là 300px.

Nhấp vào lỗi để đánh dấu dòng. ✕=lỗi ⚠=cảnh báo ›=log.

Lộ trình học · Toàn bộ bài giảng