Hướng dẫn css cho the div

Xin chào các bạn hôm nay mình xin hướng dẫn các bạn sử dụng div để tạo bố cục cho một trang web của các bạn.

Bài viết này cũng tương đối đơn gian nên tôi cũng không giải thích nhiều cho lắm nhé các bạn.

Ở đây tôi đã chuẩn bị một layout bố cục sẵn rồi giờ chỉ còn viết code cho layout đã được vẽ trên photoshop thôi.

Dưới đây là toàn bộ code. đầu tiên các bạn tạo cho tôi một file tên gì cũng được tùy các bạn nhé rồi copy source code bên dưới vào đúng vị trí là được

Code HTML

    









    

    


        


            

            


                
header


            


            

            

            


                
list mục sản phẩm


            


            

            
            

            


                
Nội dung của trang


            


            

            

            


                
list mục được xem nhiều nhất


            


            

            

            


                
copyright:nguyễn thanh hòa


            


            

        


    


    

    

Code CSS

*{margin: 0px;padding:0px;}

    div#background{width: 900px;margin: 0px auto;}

    div#background div#background_con{width: 900px;margin: 0px auto;}

    div#background_con div{float: left;}

    div.header{width: 900px;background: blue;height: 150px;text-align: center;line-height: 150px;}

    div.slide_bar_left{width: 250px;background: #ccc;height: 500px;}

    div.content{width: 400px;background: #686;height: 500px;}

    div.slide_bar_right{width: 250px;background: #ccc;height: 500px;}

    div.footer{width: 900px;background: #000;height: 100px;text-align: center;color: aqua;line-height: 110px;}

    

Còn đây là toàn bộ source code của file:

    









    

    


        


            

            


                
header


            


            

            

            


                
list mục sản phẩm


            


            




            
            

            


                
Nội dung của trang


            


            

            

            


                
list mục được xem nhiều nhất


            


            

            

            


                
copyright:nguyễn thanh hòa


            


            

        


    


    

    

Chúc các bạn làm thành công nhé!