• Save
Bài 5 - CSS và DHTML - Học lập trình web cơ bản với Html, Css, Javascript
Upcoming SlideShare
Loading in...5
×
 

Bài 5 - CSS và DHTML - Học lập trình web cơ bản với Html, Css, Javascript

on

  • 320,767 views

Mục tiêu :

Mục tiêu :
Định dạng trang web bằng CSS
Sử dụng CSS để tạo các trang DHTML

Xem thêm tại http://www.hoclaptrinhweb.com

Statistics

Views

Total Views
320,767
Views on SlideShare
1,768
Embed Views
318,999

Actions

Likes
5
Downloads
0
Comments
1

7 Embeds 318,999

http://forum.hoclaptrinhweb.com 318967
http://htmlcomponentservice.appspot.com 12
http://static.wix.com 12
http://nuevospowerpoints.blogspot.com 3
http://webcache.googleusercontent.com 3
http://nuevospowerpoints.blogspot.com.ar 1
http://www.hoclaptrinhweb.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

11 of 1

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • http://free-tvshowsonline.blogspot.com/
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Thời lượng : 5 tiết
  • Minhoa_Bai05_slide14.html
  • Minhoa_Bai05_slide28.html
  • Minhoa_Bai05_slide30.html
  • Minhoa_Bai05_slide31.html
  • Ghi chú : Giáo viên d ẫn nhập vị trí của một element trên trang web, nhấn mạnh vị trí mặc định Minhoa_Bai05_slide37.html Minhoa_Bai05_slide37B.html
  • Minhoa_Bai05_slide39.html
  • Ghi chú : Giáo viên d ẫn nhập thứ tự trên dưới của một element, nhấn mạnh vị trí mặc định Minhoa_Bai05_slide41.html Minhoa_Bai05_slide41B.html

Bài 5 - CSS và DHTML - Học lập trình web cơ bản với Html, Css, Javascript Bài 5 - CSS và DHTML - Học lập trình web cơ bản với Html, Css, Javascript Presentation Transcript

  • 11HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/
  • 22HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Mục tiêuMục tiêu• Định dạng trang web bằng CSS• Sử dụng CSS để tạo các trang DHTML
  • 33HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 5. Style động5. Style động5. Style động5. Style động 6. Nội dung động6. Nội dung động6. Nội dung động6. Nội dung động7. Vị trí động7. Vị trí động7. Vị trí động7. Vị trí động
  • 44HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Style Sheet− Là một tập hợp các khai báo styleBài 5: CSS và DHTMLGiới thiệu CSS<head><style type = "text/css"><tên tag 1> { <tên thuộc tính >: <giá trị> ; … }<tên tag 1> { <tên thuộc tính >: <giá trị> ; … }…</style></head>Các styleStyleSheet
  • 55HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Style Sheet− Là một tập hợp các khai báo styleBài 5: CSS và DHTMLGiới thiệu CSSVí dụ:<style type="text/css">h1 {color:#FF0000}div {background-color:#66CCFF; color:#0000FF; border-color:#0000FF; border-style:double; width:300}ul {list-style:square; color:#660000}</style>
  • 66HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• CSS – Cascading Style Sheets− Là một chuẩn của Internet do W3C định nghĩa− Hiệu ứng của style có thể được kế thừa từ các tag khácBài 5: CSS và DHTMLGiới thiệu CSSVí dụ:<div><ul><li> Canh chua</li><li> Cá kho tộ</li><li> Trứng chiên</li></ul></div> 
  • 77HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 5. Style động5. Style động5. Style động5. Style động 6. Nội dung động6. Nội dung động6. Nội dung động6. Nội dung động7. Vị trí động7. Vị trí động7. Vị trí động7. Vị trí động
  • 88HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các loại CSSCác loại CSS• Inline Style• Internal Style• External Style
  • 99HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Inline Style− Loại style này chính là phần khai báo thuộc tính styletrong các tag HTMLBài 5: CSS và DHTMLCác loại CSSVí dụ:<div style="color:#FF0000; background-color:#CCCCCC; border-style:inset;width:450; text-align:center; padding:10,10, 10,10">Chào mừng các bạn đến với bài học về "CSS và DHTML"</div>
  • 1010HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các loại CSSCác loại CSS• Inline Style• Internal Style• External Style
  • 1111HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Internal Style− Dùng để định nghĩa các style dùng chung trong mộttrang webBài 5: CSS và DHTMLCác loại CSS<head><style type = “text/css” id =“tên style sheet 1”><tên tag 1> { <tên thuộc tính >: <giá trị> ; … }…</style><style type = “text/css” id =“tên style sheet 2”>…</style></head>
  • 1212HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các loại CSSCác loại CSS• Inline Style• Internal Style• External Style
  • 1313HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• 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 SheetBài 5: CSS và DHTMLCác loại CSS
  • 1414HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• External Style− Khai báo và sử dụng:• Khai báo trong tập tin .css• Liên kết với trang webBài 5: CSS và DHTMLCác loại CSS<tên tag> { <tên thuộc tính >: <giá trị> ; … }<head>…<link rel=stylesheet href="<tên tập tin>.css" type="text/css"></head>Minh họaMinh họa
  • 1515HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 5. Style động5. Style động5. Style động5. Style động 6. Nội dung động6. Nội dung động6. Nội dung động6. Nội dung động7. Vị trí động7. Vị trí động7. Vị trí động7. Vị trí động
  • 1616HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Tạo và sử dụng CSS phức tạpTạo và sử dụng CSS phức tạp• Grouping - nhóm• Class – lớp
  • 1717HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Grouping – nhóm− Khai báo một style áp dụng cho nhiều tag khác nhauBài 5: CSS và DHTMLTạo và sử dụng CSS phức tạp<head><style type = “text/css” ><tên tag 1>, <tên tag 2>, … { <tên thuộc tính >: <giá trị> ; … }…</style></head>Ví dụ:<style type="text/css">h1, h2, h3 {color: red; font-family:sans-serif }</style>
  • 1818HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Tạo và sử dụng CSS phức tạpTạo và sử dụng CSS phức tạp• Grouping - nhóm• Class – lớp
  • 1919HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Class – lớp− Khai báo nhiều style khác nhau cho cùng một tag hoặccho nhiều tag− Khai báo• Cùng một tag• Nhiều tag khác nhauBài 5: CSS và DHTMLTạo và sử dụng CSS phức tạp<tên tag>.<tên lớp> {<danh sách thuộc tính> }.<tên lớp> {<danh sách thuộc tính> }
  • 2020HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Class – lớp− Sử dụngBài 5: CSS và DHTMLTạo và sử dụng CSS phức tạp<têntag class = ”tên lớp” ... >
  • 2121HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Class – lớpBài 5: CSS và DHTMLTạo và sử dụng CSS phức tạpVí dụ: sử dụng style cho tag <p><head><style type="text/css">p{ color: red; font-size: 20px; font-weight:bold}p.dong1{ color: blue; font-size: 18px; }p.dong2{ font-size: 16px; }</style></head><body ><p> HocLapTrinhWeb.com </p><p class="dong1"> Học lập trình web cơ bản </p><p class="dong2"> Học lập trình web nâng cao </p></body>
  • 2222HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Class – lớpBài 5: CSS và DHTMLTạo và sử dụng CSS phức tạpVí dụ: sử dụng style cho nhiều tag<head><style type="text/css">.dong1{ color: red; font-size: 20px; font-weight:bold}.dong2{ color: blue; font-size: 18px;}.dong3{ color: #000099; font-size: 16px; }</style></head><body ><p class="dong1"> HocLapTrinhWeb.com<br><label class="dong2"> Học lập trình web cơ bản</label><br><label class="dong3"> Học lập trình web nâng cao</label></body>
  • 2323HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Các mục thường định 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à BordersBài 5: CSS và DHTMLTạo và sử dụng CSS phức tạp
  • 2424HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 5. Style động5. Style động5. Style động5. Style động 6. Nội dung động6. Nội dung động6. Nội dung động6. Nội dung động7. Vị trí động7. Vị trí động7. Vị trí động7. Vị trí động
  • 2525HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Giới thiệu DHTML – Dynamic HTML− Tạo tính “linh động” cho trang web− Xử lý các yêu cầu khi người dùng tương tác với trangweb− Là sự kết hợp HTML, CSS, DOM và một ngôn ngữclient-side script− Không phải là chuẩn của W3CBài 5: CSS và DHTMLGiới thiệu DHTML
  • 2626HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 5. Style động5. Style động5. Style động5. Style động 6. Nội dung động6. Nội dung động6. Nội dung động6. Nội dung động7. Vị trí động7. Vị trí động7. Vị trí động7. Vị trí động
  • 2727HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Style động – Dynamic StylesStyle động – Dynamic Styles• Thay đổi thuộc tính• Thay đổi style
  • 2828HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Thay đổi thuộc tính− Sử dụng cú pháp tham chiếu đến một đối tượng trongDOMBài 5: CSS và DHTMLStyle động – Dynamic StylesVí dụ: thay đổi thuộc tính src của tag <img>Minh họaMinh họa
  • 2929HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Style động – Dynamic StylesStyle động – Dynamic Styles• Thay đổi thuộc tính• Thay đổi style
  • 3030HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Thay đổi styleCó 2 cách làm thay đổi Inline Style− Thay đổi thuộc tính style: thường dùng từ khóa this vàviết code trực tiếp vào sự kiệnBài 5: CSS và DHTMLStyle động – Dynamic StylesVí dụ:<div id="nd" onMouseOver="this.style.fontSize=36"onMouseOut="this.style.fontSize=16" >Một bông hồng cho em</div>this.style.<tên thuộc tính> = <giá trị>Minh họaMinh họa
  • 3131HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Thay đổi style− Thay đổi tên lớp: dùng để thay đổi nhiều thông tin trongthuộc tính styleBài 5: CSS và DHTMLStyle động – Dynamic StylesVí dụ:<head><style type="text/css">.vao { font-size:36px; color:#FF0000; font-weight:bold; font-style:italic}.ra { font-size:16px; color:black; text-decoration: none}</style></head><body><div id="nd" onMouseOver="this.className=vao "onMouseOut="this.className=ra ">Một bông hồng cho em</div></body>this.className = ‘Tên lớp’Minh họaMinh họa
  • 3232HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 5. Style động5. Style động5. Style động5. Style động 6. Nội dung động6. Nội dung động6. Nội dung động6. Nội dung động7. Vị trí động7. Vị trí động7. Vị trí động7. Vị trí động
  • 3333HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Nội dung động− Chèn vào, hủy bỏ hoặc thay đổi nội dung của mộtelement.− Thay đổi nội dung: thường sử dụng thuộc tínhinnerText, innerHTML hoặc valueBài 5: CSS và DHTMLNội dung động – Dynamic content
  • 3434HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS1. Giới thiệu CSS 2. Các loại CSS2. Các loại CSS2. Các loại CSS2. Các loại CSS 3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp3. Tạo và sử dụng3. Tạo và sử dụngCSS phức tạpCSS phức tạp4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML4. Giới thiệu DHTML 3. Style động3. Style động3. Style động3. Style động 4. Nội dung động4. Nội dung động4. Nội dung động4. Nội dung động5. Vị trí động5. Vị trí động5. Vị trí động5. Vị trí động
  • 3535HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Vi trí động – Dynamic positionVi trí động – Dynamic position• Thuộc tính position• Thuộc tính visibility• Thuộc tính z-index
  • 3636HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/− Định vị trí của một element (theo tọa độ (x,y) hay left, top)− Gối chồng các element với nhau theo thứ tự trên, dưới.− Thường sử dụng các thuộc tính left, top, position,visibility và z-index.Bài 5: CSS và DHTMLVị trí động – Dynamic position
  • 3737HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Thuộc tính position− Khai báo loại vị trí của một element− Có 3 giá trị:• static: mặc định. Thuộc tính left và top sẽ không có tác dụngnếu element có position là static• absolute: vị trí dịch chuyển của đối tượng tùy theo vị trí củaelemnet cha hoặc element body• relative: vị trí dịch chuyển của đối tượng tùy theo vị trí banđầu khi viết code HTMLBài 5: CSS và DHTMLVị trí động – Dynamic positionMinh họaMinh họaMinh họaMinh họa
  • 3838HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Vi trí động – Dynamic positionVi trí động – Dynamic position• Thuộc tính position• Thuộc tính visibility• Thuộc tính z-index
  • 3939HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Thuộc tính visibility− Dùng để thể hiện hoặc làm ẩn đi một đối tượng− Có 2 giá trị:• visible: thể hiện đối tượng lên trang web• hidden: làm ẩn đi đối tượngBài 5: CSS và DHTMLVị trí động – Dynamic positionVí dụ: thể hiện khẩu hiệu “Học, học nữa, học mãi” khi rê chuột vàohình và ngược lại làm ẩn điMinh họaMinh họa
  • 4040HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Vi trí động – Dynamic positionVi trí động – Dynamic position• Thuộc tính position• Thuộc tính visibility• Thuộc tính z-index
  • 4141HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Thuộc tính z-index− Dùng để gối chồng các element lên nhau theo thứ tựtrên, dưới− Giá trị của thuộc tính là các con số− Thường kết hợp với thuộc tính visibility và positionBài 5: CSS và DHTMLVị trí động – Dynamic positionMinh họaMinh họaMinh họaMinh họa
  • 4242HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Bài 5: CSS và DHTMLHẾTHẾT