Skip to content

Latest commit

 

History

History
11 lines (11 loc) · 1.85 KB

File metadata and controls

11 lines (11 loc) · 1.85 KB
  1. Cho một hình thiết kế như này với tên gọi trong tiếng Anh là card áp dụng BEM để kể ra block, elements, và modifier nếu có: https://static.collectui.com/shots/2451336/daily-ui-challenge-011-large ví dụ: card__image
  2. Tạo một khối có class là box có độ rộng và chiều cao lần lượt là 200x300 có màu nền là #ffa400 và chữ bất kỳ màu đen, border màu vàng, padding 10px, margin 15px bo góc 4px, chữ canh giữa. Lưu ý sử dụng đơn vị rem
  3. Tạo một khối có đoạn chữ rất dài bât kỳ, có độ rộng tối đa là 500px hiển thị 3 hàng kết hợp dấu 3 chấm
  4. Tạo một khối có đoạn chữ rất dài bât kỳ, có độ rộng tối đa là 100px hiển thị 1 hàng kết hợp dấu 3 chấm
  5. Cho một hình thiết kế như này, gọi là product hiểu về BEM và liệt kê ra các class về block, elements, modifer nếu có: https://static.collectui.com/shots/2414184/travel-bag-detail-spare-time-fun-large ví dụ: product__container
  6. Tạo một khối có độ rộng và chiều cao lần lượt là 100vw 100vh cho hình nền bất kỳ, yêu cầu phủ toàn khối, canh góc bên phải, không có lặp lại
  7. Tạo một khối có độ rộng và chiêu cao tương ứng là 400x400 và cho hình ảnh hiển thị bên trong, yêu cầu khối này là hình tròn, và hình ảnh nằm trọn bên trong, không được méo, không được tràn ra ngoài, gợi ý dùng border-radiusoverflow:hidden
  8. Chèn font từ Google vào bài tập sử dụng Fonts Roboto với các độ đậm là 400600
  9. Chỉ là yêu cầu: phải sử dụng đơn vị rem cho hợp lý, không sử dụng px, sử dụng box-sizing để hiển thị cho đúng kích thước,