Giải SGK Tin học 12 CTST Bài F11. Định kiểu CSS cho bảng và phần tử <DIV> có đáp án

Thực hiện viết mã lệnh CSS để định kiểu nền màu vàng nhạt cho các hàng lẻ trong bảng.

tr:nth-child(even) {

backgroun-color: #e5e5e5;

}

th {

background-color: #3eafff;

color: #fff;

}

Thực hiện viết mã lệnh CSS để tạo ra 3 vùng A, B, C lần lượt năm kề nhau theo phương ngang:

$<$div> Vùng A </div>

$<$div> Vùng B </div>

$<$div> Vùng C </div>

.left {

float: left;

}

.right {

float: right;

}

Để định kiểu đường viền đơn hoặc đôi cho bảng, em sử dụng thuộc tính boder-collapse.

Để định kiểu màu sắc xen kẽ cho các hàng chẵn và lẻ, em khai báo vùng chọn là: tr: nth-child()

Những thuộc tính và giá trị dùng để định kiểu cho thẻ $<$div> giúp tạo bố cục trang web:

Khi thay đổi bố cục, em chỉ cần hiệu chỉnh mã lệnh CSS mà không làm ảnh hưởng đến các nội dung bên trong $<$div>.

Theo mặc định khi chưa định kiểu, các phần tử $<$div> sẽ được kết xuất theo thứ tự lần lượt từ trên xuống dưới. Chẳng hạn, với đoạn mã HTML dưới đây, nội dung của vùng A sẽ kết xuất ở trên, nội dung của vùng B sẽ kết xuất ở dưới.

$<$div> vùng A </div>

$<$div> vùng B </div>

Để định kiểu cho vùng A nằm về bên trái, em chỉ định giá trị left cho thuộc tính float. Đồng thời, để vùng B nằm về bên phải, em chỉ định giá trị right cho thuộc tính float (hình 5).

Mặt khác, nếu không khai báo fload: right; thì vùng B sẽ tự động kết xuất ngay bên phải của vùng A (hình 6)