CHUYÊN ĐỀ CSDL VÀ LẬP TRÌNH ỨNG DỤNG WEB 1- P44 doc

Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS CSS - - Inline Style Sheet Inline Style Sheet  Định nghĩa style trong thuộc tính style củatừng tag HTML.  Theo cú pháp kiểu1. <tag style = “property1:value1;…propertyN:valueN;”> …. </tag>  Không sử dụng lại được.  Ví dụ: <H1 STYLE="color: yellow">This is yellow</H1> Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS CSS - - Embedding Style Sheet Embedding Style Sheet  Còn gọilàInternal Style Sheet hoặc Document-Wide Style Sheet  Mọi định nghĩastyle được đặt trong tag <style> của trang HTML.  Định nghĩa style theo cú pháp kiểu2.  Trang HTML có nội dung như sau: <head> <style type=“text/css” > <! SelectorName { property1:value1; property2:value2; ……… propertyN:valueN;} > </style> </head> Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS CSS - - Embedding Style Sheet Embedding Style Sheet Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS CSS - - External Style Sheet External Style Sheet  Mọistyle đềulưu trong file có phầnmở rộng là *.CSS.  File CSS: lưutrữ nhiều style theo cú pháp kiểu2.  Trong file HTML: liên kếtbằng tag link. Cú pháp: <head> <link rel=“stylesheet” href=“URL” type="text/css"> </head>  Trang HTML : Liên kếtbằng tag style với @import url. Cú pháp <head> <style type=“text/css” media="all | print | screen" > @import url(URL); </style> </head> Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS CSS - - External Style Sheet External Style Sheet Trong tậptin MyStyle.CSS H2 { FONT-WEIGHT: bold; FONT-SIZE: 16pt; COLOR: white; FONT-STYLE: italic; FONT-FAMILY: Arial; BACKGROUND-COLOR: red; font-color: white } Trong trang Web : demo.htm <html> <head> <title>Cass………</title> <link HREF="MyStyle.css" REL="stylesheet" > </head> <body> <h2>This is an H2 </h2> </body> </html> . “property1:value1;…propertyN:valueN;”> …. </tag>  Không sử dụng lại được.  Ví dụ: <H1 STYLE="color: yellow">This is yellow</H1> Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet ©. Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS. { property1:value1; property2:value2; ……… propertyN:valueN;} > </style> </head> Lập trình và Thiếtkế Web 1 – Bài 4 :CSS – Casscading Styte Sheet © 2007 Khoa CNTT - ĐHKHTN S S ử ử d d ụ ụ ng ng v v à à Phân Phân lo lo ạ ạ i i CSS