Diễn Đàn SEO Panda - SEO Panda Forum

Diễn Đàn SEO Panda Dành Cho Các SEOers Tự Do Thảo Luận SEO - SEO Panda Forum - Free SEO Forum to share your knowledge to the world
 
HomeCalendarFAQSearchMemberlistUsergroupsRegisterLog in
Search
 
 

Display results as :
 
Rechercher Advanced Search
Latest topics

Share | 
 

 HTML5 và CSS3 – Công nghệ thiết kế website trong tương lai – Phần 6

View previous topic View next topic Go down 
AuthorMessage
khiemsound



Posts : 1016
Points : 11650
Join date : 2012-03-27

PostSubject: HTML5 và CSS3 – Công nghệ thiết kế website trong tương lai – Phần 6   Wed May 23, 2012 9:12 am

HTML5 và CSS3 – Công nghệ thiết kế website trong tương lai – Phần 6


HTML5 và CSS3 – Công nghệ thiết kế website trong tương lai – Phần 6



Định nghĩa phần content và sidebar
Phần content và siderbar trong cấu trúc trang html5 được căn chỉnh khác nhau trên từng phần khác nhau. Theo các cách định nghĩa thông thường chúng ta thường sử dụng thuộc tính “float” để căn chỉnh, tuy nhiên với CSS3 chúng ta có thể sử dụng theo kiểu “table”
Table là gì? chẳng phải là thẻ định nghĩa 1 bảng sao? Bạn có thể băn khoăn và đặt ra câu hỏi như vậy, và có thể bạn đã biết tới “table” trong thiết kế các giao diện trước kia. Tuy nhiên trong CSS3 chúng ta có thể tạo các phần tử có cấu trúc tương tự “table” mà ta đã biết nhưng không phải sử dụng thẻ "table". Để bắt đầu , chúng ta cần một vài thẻ
để tạo ra một section














Tất cả mọi thứ chúng ta tạo ra vẫn chưa được định nghĩa và bây giờ chúng ta sẽ định nghĩa cho nó. Chúng ta muốn
có cấu trúc giống như một “table” với “mainContent” và “aside” là các ô trong bảng. Như những gì bạn được biết trước đây về “table” thì điều này là “không thể” phải không? Bởi “table” được định nghĩa cụ thể không thẻ tùy chỉnh theo ý muốn được, nhưng với CSS3 thì điều này lại là một điều cực kỳ dễ dàng.
#content {
display: table;
}
#mainContent {
display: table-cell;
width: 620px;
padding-right: 22px;
}
aside {
display: table-cell;
width: 300px;
}
Sau khi xem xong cách định nghĩa này bạn có thể hiểu tại sao tôi lại nói nó thật sự dễ dàng phải không?
Đó là tất cả, không cần tới “float” không cần tới “column” không cần tới “background-image”, clear, hay collapsing margin, chúng ta vẫn có thể tạo ra các phần tử có cấu trúc tương tự “table”. Tới đây chắc hẳn các bạn sẽ có thể thốt lên rằng “ôi! Tạo một layout thật dễ dàng phải không?”

bạn có thể tham khảo thêm các phần khác tại đây!
Back to top Go down
View user profile
 
HTML5 và CSS3 – Công nghệ thiết kế website trong tương lai – Phần 6
View previous topic View next topic Back to top 
Page 1 of 1
 Similar topics
-
» Css3 JavaScript div cylinder
» Adding A Floating Menu!
» Rollover Button Using CSS
» How to add auto-resize
» selenium.click("id=xxx"); not working

Permissions in this forum:You cannot reply to topics in this forum
Diễn Đàn SEO Panda - SEO Panda Forum :: Free Market :: Domain Name & Website-
Jump to: