Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 251 trang
THÔNG TIN TÀI LIỆU
Thông tin cơ bản
Định dạng
Số trang
251
Dung lượng
2,3 MB
Nội dung
Một số điều cần chú ý trong CSS 1.Selector. [...]... HTML viết: HTML/XHTML CSS JQUERY JAVASCRIPT Hiển thị trình duyệt khi chưa có CSS: HTML/XHTML CSS JQUERY JAVASCRIPT CSS viết: body {counter-reset: tenBatKy;} p:before { counter-increment: tenBatKy; content: counter(tenBatKy) } Hiển thị trình duyệt khi có CSS: 1.HTML/XHTML 2 .CSS 3.JQUERY "."; 4.JAVASCRIPT Ví dụ về thuộc tính counter-reset... viết: HTML/XHTML CSS JQUERY JAVASCRIPT Hiển thị trình duyệt khi chưa có CSS: HTML/XHTML CSS JQUERY JAVASCRIPT CSS viết: body {counter-reset: tenBatKy;} p:before { counter-increment: tenBatKy; content: counter(tenBatKy) "."; } Hiển thị trình duyệt khi có CSS: 1.HTML/XHTML 2 .CSS 3.JQUERY 4.JAVASCRIPT Ví dụ về thuộc tính cursor Định... 5000d 500d 4000d Hiển thị trình duyệt khi chưa có CSS (mặc định của caption-side là top): Caption của table Thu hai Thu ba 2000d 5000d 500d 4000d CSS viết: caption { caption-side: bottom; } Hiển thị trình duyệt khi có CSS: Caption của table Thu hai Thu ba 2000d 5000d 500d 4000d Ví dụ về thuộc tính clear Định nghĩa và sử dụng Thuộc tính... Hiển thị trình duyệt khi chưa có CSS: HỌC WEB CHUẨN CSS viết: p { color: #ff0000; } Ví dụ về thuộc tính content Thuộc tính content Thuộc tính content sử dụng kèm với bộ chọn :before, :after để chèn nội dung được tạo content: "thêm text"; Thuộc tính content: "thêm text"; : nội dung trong dấu ngoặc sẽ được thêm vào thành phần p:after { content: ": Đây là nội... 2000d 5000d 500d 4000d Hiển thị trình duyệt khi chưa có CSS: Thu hai Thu ba 2000d 5000d 500d 4000d CSS viết: table { border-collapse: collapse; } Hiển thị trình duyệt khi có CSS: Thu hai Thu ba 2000d 5000d 500d 4000d Ví dụ về thuộc tính border-spacing Định nghĩa và sử dụng Thuộc tính border-spacing xác định khoảng... 2000d 5000d 500d 4000d Hiển thị trình duyệt khi chưa có CSS: Thu hai Thu ba 2000d 5000d 500d 4000d border-spacing với một giá trị, CSS viết: table { border-spacing: 10px; } border-spacing với 2 giá trị, CSS viết: table { border-spacing: 10px 30px; } Ví dụ về thuộc tính bottom Định nghĩa và sử dụng Thuộc tính bottom được dùng để... dưới (bottom) CSS viết: Giả sử ta có một block có các giá trị position như bên dưới (Xem thêm thuộc tính position) div { border: 1px solid #ccc; height: 100px; position: relative; } div p { position: absolute; } Hiển thị trình duyệt khi chưa sử dụng thuộc tính bottom: Đây là tag p có vị trí dưới (bottom) Thêm thuộc tính bottom vào CSS, ta có: div { border: 1px solid #ccc;... border-style, borderwidth p { border-right: #ff0000 solid 2px; } border-right Thuộc tính border-bottom Thuộc tính border-bottom : xác định đường viền bên dưới Cấu trúc theo dạng tổng hợp của các thuộc tính: border-color, border-style, borderwidth p { border-bottom: #ff0000 solid 2px; } ... Dòng text này có sử dụng thuộc tính clear, nên không bị ảnh hưởng float của thành phần p class=exFloat CSS viết: Giả sử ta có một thành phần dùng float: left; như sau p.exFloat { float: left; } Thêm thuộc tính clear vào CSS: p.exFloat { float: left; } p.exClear { clear: left; } Ví dụ về thuộc tính clip Định nghĩa và sử dụng Thuộc tính clip xác định đoạn cho thành... (thành phần bao ngoài) clip: inherit; Ví dụ HTML viết: Hiển thị trình duyệt khi chưa có CSS: CSS viết: p img { position: absolute; clip: rect(48px, 126px, 80px, 5px); } Ví dụ về thuộc tính color Định nghĩa và sử dụng Thuộc tính color xác định màu sắc cho text Cấu trúc tag { color: giá trị; . số điều cần chú ý trong CSS 1.Selector.