CÚ PHÁP CỦA CSS

Cú pháp Class trong CSS

.classname { .nnlClass {
Property1: value1; text-transform: uppercase;
Property2: value2; color: red;
} }
Cú pháp ID trong CSS

#IDname { #nnlID{
Property1: value1; text-transform: uppercase;
Property2: value2; color: red;
} }
Cú pháp thẻ trong CSS

tagname { h1 {
Property1: value1; text-transform: uppercase;
Property2: value2; color: red;
} }
Cú pháp thẻ + class của CSS

tagname.classname { h1.nnlClass {
Property1: value1; text-transform: uppercase;
color: red;
Property2: value2;
} }
Cú pháp thẻ + class của CSS

tagname#classname h1#nnlID {
{ text-transform: uppercase;
Property1: value1; color: red;

Property2: value2; }
}
Cú pháp nhiều thẻ trong CSS

tagname1,tagname2 h1, h2 {
{ text-transform: uppercase;
Property1: value1; color: red;

Property2: value2; }
}
Cú pháp thẻ con trong CSS

tagname1 tagname2 pa {
{ text-transform: uppercase;
Property1: value1; font-size: 20px;

Property2: value2; }
}
Cú pháp thuộc tính trong thẻ

Tagname[attrName] { a[target] {
Property1: value1; background-color:
Property2: value2; yellow;}

Xem thêm : https://www.w3schools.com/css/css_attribute_selectors.asp

Cú pháp CSS trên Input

Tagname[attrName] { a[target] {
Property1: value1; background-color:
Property2: value2; yellow;}

Xem thêm : https://www.w3schools.com/css/css_attribute_selectors.asp

Cú pháp CSS trên input Form

Tagname[attrName=value] { input[type=button] {
Property1: value1; background-color: yellow;
Property2: value2;
} }

Xem thêm : https://www.w3schools.com/css/css_attribute_selectors.asp

BỐ CỤC WEBSITE

Người thực hiện: Nguyễn Ngọc Lâm

NHÓM THẺ BỐ CỤC WEB
NHÓM THẺ BỐ CỤC WEB HTML5

• THẺ <header></header>
• THẺ <nav></nav>
• THẺ <main></main>
– THẺ <section></section>
– THẺ <article></article>
– THẺ <aside></aside>
• THẺ <footer></footer>
NHÓM THẺ BỐ CỤC WEB
NHÓM THẺ BỐ CỤC WEB
Thiết kế bố cục
Thuộc tính display
Thuộc tính flex-direction
Thuộc tính flex-wrap
Thuộc tính flex-wrap
Thuộc tính flex-wrap
Thuộc tính flex-wrap
Thuộc tính justify-content
Thuộc tính justify-content
Thuộc tính align-items
Thuộc tính align-items
Thuộc tính align-content
Thuộc tính align-content
Thuộc tính flex
Thuộc tính flex-grow
Thuộc tính flex-shrink
Bài tập 01
Bài tập 02
Bài tập 03
Bài tập 05
Bài tập 04
Tài liệu tham khảo

1. Learning Web Design: A Beginner's Guide to HTML, CSS,

JavaScript, and Web Graphics - Jennifer Robbins

2. https://www.w3schools.com/html/default.asp
Xin chân thành cảm ơn !