Câu hỏi:
11/07/2024 68Sử dụng vùng chọn là tên lớp để định kiểu cho các hình ảnh sao cho các ảnh được căn giữa theo độ rộng của trang web, nằm trong nền màu tối bo tròn 4 góc và chỉnh sửa kích thước hiển thị phù hợp (Hình 5).
Sách mới 2k7: 30 đề đánh giá năng lực DHQG Hà Nội, Tp. Hồ Chí Minh, BKHN 2025 mới nhất (600 trang - chỉ từ 160k).
Quảng cáo
Trả lời:
0 Trong lập portfolio,html, đặt các ảnh vào cặp thẻ <div></div> như sau:
<div>
</div>
<img src="Images/Anh_1.jpg">
<img src="Images/Anh_2.jpg">
Các định kiểu từ bước này được đặt trong tập style.css. Định kiểu cho thẻ <div> bằng cách khai báo vùng chọn là lớp image-style như sau:
.image-style {
}
background-color: rgb(51, 51, 51); text-align: center;
Trong đó, thuộc tính background-color dùng để tạo nên màu tối và thuộc tỉnh text-align dùng để căn giữa cho ảnh.
Chỉ định tên lớp image-style cho thuộc tính class của thẻ <div);
<div class="image-style">
</div>
<img src="Images/Anh_1.jpg"> <img src="Images/Anh_2.jpg">
Vì các ảnh có kích thước lớn, có thể che mất phân nến, em thu nhỏ ảnh với khai báo vùng chọn kết hợp giữa lớp và thủ như sau:
.image-style img {
padding: 20px;
max-height: 75%;
}
max-width: 75%; Chan trời sang tạo
40px;
Trong đó, vùng chọn .image-style img được dùng để định kiểu cho các thẻ <img) nằm trong thẻ <div> mà có thuộc tính class là .image-style. Nói cách khác, các thẻ <img) không thuộc thẻ <div> này sẽ không được định kiểu theo vùng chọn này.
5 Nháy đúp chuột vào tệp portfolio.html để kiểm tra kết quả.
CÂU HỎI HOT CÙNG CHỦ ĐỀ
Câu 2:
Sử dụng tệp portfolio.html chưa được định kiểu bằng CSS.
Nhiệm vụ 1. Định kiểu CSS cho vùng chọn là tên thẻ
Yêu cầu: Sử dụng vùng chọn để định kiểu cho các đề mục hi của tệp portfolio.html (Hình 4) theo các yêu cầu sau:
Phần văn bản có màu trắng, cỡ chữ 20, phông chữ Arial.
Phần nền của để mục h1 màu xanh, có độ rộng chiếm một nửa độ rộng của trang web, bo tròn góc trên và góc dưới ở bên phải.
Phần văn bản được căn phải đối với phần nền, có vùng đệm là 10 pixels.
Câu 4:
Theo em, điểm khác biệt giữa khai báo vùng chọn là tên thẻ và khai báo vùng chọn là tên lớp là gì?
Câu 5:
Em hãy thực hiện các yêu cầu dưới đây.
1. Định kiểu màu sắc tuỳ ý cho phần nền và phần văn bản của các danh sách Sở thích và Các hoạt động đã tham gia bằng vùng chọn tên lớp.
2. Thay đổi định kiểu cho đề mục Lịch sinh hoạt hằng tuần với các thuộc tính tuỳ ý bằng vùng chọn id.
3. Định kiểu với màu sắc tuỳ ý để làm nổi bật một số ô trong bảng Lịch sinh hoạt hằng tuần bằng vùng chọn id hoặc tên lớp.
Câu 6:
Theo em, khi định kiểu cho các đề mục h1, việc viết mã lệnh CSS cho thuộc tính style trong từng thẻ <h1> gặp những hạn chế nào?
về câu hỏi!