Trưng bày
Official Website: https://www.sourcecodester.com/. . . . .display.html
Giới thiệu: Đây là phần thứ bảy trong hướng dẫn Tạo kiểu CSS của tôi, trong đó tôi sẽ trình bày về hiển thị. Hiển thị là gì? Hiển thị là thuộc tính đặt loại hành vi sẽ được đưa ra liên quan đến vị trí của các phần tử nhất định. Cấu trúc: hiển thị: {type}; Ví dụ:Mặc định: Như một vài ví dụ mặc định; một hình ảnh được cung cấp thông qua thẻ img trong HTMl là phần tử khối, đoạn văn (p) là phần tử khối và span là phần tử khối nội tuyến. Giá trị: Bán kính đường viền càng lớn thì đường viền sẽ càng cong. inline – Hiển thị một phần tử dưới dạng khối phần tử nội tuyến (như ) – Hiển thị phần tử dưới dạng phần tử khối (như
) inline-block – Hiển thị một phần tử dưới dạng vùng chứa khối cấp độ nội tuyến. Phần bên trong của khối này được định dạng dưới dạng hộp cấp khối và bản thân phần tử được định dạng dưới dạng bảng cấp độ nội tuyến – Phần tử được hiển thị dưới dạng mục danh sách bảng cấp độ nội tuyến – Để phần tử hoạt động giống như mộtphần tử chạy vào – Hiển thị một phần tử dưới dạng khối hoặc nội dòng, tùy thuộc vào bảng ngữ cảnh – Để phần tử hoạt động giống như chú thích bảng phần tử – Để phần tử hoạt động giống như một nhóm phần tử table-header-group – Để phần tử hoạt động giống như một phần tử table-footer-group – Để phần tử hoạt động giống như một phần tử table-row-group – Để phần tử hoạt động giống như một phần tử table-cell – Để phần tử hoạt động giống như một phần tử table-row – Để phần tử hoạt động giống như một phần tử không – Kế thừa phần tử sẽ không được hiển thị (không ảnh hưởng đến bố cục) – Giá trị của thuộc tính hiển thị sẽ được kế thừa từ phần tử cha Liên kết CSS với phần tử HTML: Để liên kết CSS của bạn với phần tử HTML (văn bản, div, v.v.), bạn sẽ cần phải quyết định xem bạn muốn sử dụng lớp hay id, bạn cũng sẽ cần một tên duy nhất. Khi bạn đã có những thứ đó, hãy chuyển đến phần tử của bạn trong HTML và thêm…… vào các thuộc tính của phần tử đó nếu bạn chọn một lớp, hoặc…nếu bạn chọn một id. Đảm bảo bạn thay thế ‘myClass’ và/hoặc ‘myID’ bằng tên duy nhất của bạn. Sau đó, trong CSS, bạn sẽ muốn bao bọc các thuộc tính của mình bằng…nếu bạn chọn một lớp học, hoặc…(Bạn có thể xóa dòng bắt đầu bằng // nếu muốn). Đây là một ví dụ…
| cột bảng phần tử – Để phần tử hoạt động như một |