Nhập môn lập trình web với PHP - Bài 3: CSS cơ bản

Chia sẻ: Minh Hoang | Ngày: | Loại File: PDF | Số trang:20

Thêm vào BST

Báo xấu

158
lượt xem 22
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Tài liệu tham khảo và hướng dẫn chi tiết về lập trình web động với PHP / MySQL.Giáo trình sau giúp bạn tự học lập trình web bằng PHP và MySQL để làm Forum, Blog, Shop bán hàng, CMS tin tức.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Nhập môn lập trình web với PHP - Bài 3: CSS cơ bản

TRUNG TÂM TIN HỌC ĐẠI HỌC KHOA HỌC TỰ NHIÊN-TP.HCM NHẬP MÔN LẬP TRÌNH WEB VỚI PHP 1
TRUNG TÂM TIN HỌC ĐẠI HỌC KHOA HỌC TỰ NHIÊN-TP.HCM Bài 3: CSS cơ bản 1. Giới thiệu CSS 2. Các loại CSS 3. Sử dụng CSS 4. Các style thường dùng 2
Bài 3: CSS cơ bản 1. Giới thiệu CSS  Style Sheet  CSS – Cascading Style Sheets 3
Bài 3: CSS cơ bản Style Sheet  Là một tập hợp các khai báo style Style { : ; … } Các style Sheet { : ; … } … 4
Bài 3: CSS cơ bản Style Sheet  Là một tập hợp các khai báo style Ví dụ: h1 {color:#FF0000} div {background-color:#66CCFF; color:#0000FF; border- color:#0000FF; border-style:double; width:300} ul {list-style:square; color:#660000} 5
Bài 3: CSS cơ bản CSS – Cascading Style Sheets  Là một chuẩn của Internet do W3C duy trì  Hiệu ứng của style có thể được kế thừa từ các tag khác Ví dụ: Canh chua Cá kho tộ Trứng chiên 6
Bài 3: CSS cơ bản 2. Các loại CSS  Inline Style  Internal Style  External Style 7
Bài 3: CSS cơ bản Inline Style  Loại style này chính là phần khai báo thuộc tính style trong các tag HTML Ví dụ: Chào mừng các bạn đến với bài học về "CSS và DHTML" 8
Bài 3: CSS cơ bản Internal Style  Dùng để định nghĩa các style dùng chung trong một trang web selector1 { : ; … } … … 9
Bài 3: CSS cơ bản External Style  Dùng chung trong một website  Phần khai báo nằm trong một tập tin có kiểu là .css và tập tin này được xem như là một Style Sheet 10
Bài 3: CSS cơ bản External Style  Khai báo và sử dụng: – Khai báo trong tập tin .css selector { : ; … } – Liên kết với trang web … 11
Bài 3: CSS cơ bản 3. Sử dụng CSS  Phân loại Selector  Nhóm các Selector 12
Bài 3: CSS cơ bản Phân loại Selector  Phân loại selector theo cách áp dụng style: – Selector = ten_tag_html: áp dụng style cho tất cả các tag html có tên là ten_tag_html – Selector = .ten_class: áp dụng style cho các thẻ html có thuộc tính class=“ten_class” – Selector = #tag_id: áp dụng style cho các thẻ html có thuộc tính id=“tag_id” 13
Bài 3: CSS cơ bản Phân loại Selector  Selector = ten_tag_html Ví dụ: tạo selector div để áp dụng style cho tất cả các thẻ div div{color:#FF0000} Chào các bạn Chào các bạn 14
Bài 3: CSS cơ bản Phân loại Selector  Selector = .ten_class Ví dụ: tạo selector .thong_bao để áp dụng style cho các thẻ có thuộc tính class="thong_bao". .thong_bao{color:#FF0000} Chào các bạn Chào các bạn 15
Bài 3: CSS cơ bản Phân loại Selector  Selector = #tag_id Ví dụ: tạo selector #loi_chao để áp dụng style cho thẻ có id="loi_chao" #loi_chao{color:#FF0000} Chào các bạn Chào các bạn 16
Bài 3: CSS cơ bản Nhóm các selector  Các selector có cùng thuộc tính định dạng thì có thể định nghĩa chúng trong cùng style và selector sẽ cách nhau dấu phẩy (,)  Cú pháp: Selector1, Selector2, ... { thuoc_tinh1: gia_tri1; thuoc_tinh2: gia_tri2; ... } 17
Bài 3: CSS cơ bản Nhóm các selector #loi_chao, .thong_bao{color:#FF0000} Chào các bạn Chào các bạn Chào các bạn Chào các bạn 18
Bài 3: CSS cơ bản 4. Các style thường dùng  Font chữ  Màu chữ và nền (màu, hình ảnh) – Colors và Background  Canh lề văn bản - Text Alignment  Lề văn bản và đường viền – Margins và Borders 19
Bài 3: CSS cơ bản 20