Home > Web Front-end > HTML Tutorial > Simple div css layout 2_html/css_WEB-ITnose

Simple div css layout 2_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:32:00
Original
1087 people have browsed it

 

续简单的div+css的布局之一

 

left-top.gif                    right-top.gif

 

right.gif                          left-bottom.gif

 

 

right-bottom.gif

 

p3

实例 3 代码:

 

 

 

     

      

      

Page Content

   

          

               这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中

           

           

           

           

      

           

      

      

Page Content1

   

          

               这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中

           

           

           

           

      

   

   

         

 

         

             

                    

                    

Page Side

                 

          

               这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中

           

           

           

           

                    

                    

Page Side3

                 

          

               这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中

           

           

           

           

           

           

           

      

      

Page Side2

   

          

               这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中

           

           

           

           

           

      

 

 

        

p4

实例 4 代码:

 


固定宽度  相对定位

 



 
 

  

 

 

Page Content


   

     


         这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中
           


           

           
           

 

 

 

Page Contentb


   

     


         这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中
           


           

           
           

 

   
   
           

 

 

Page Content1


   

     


         这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中
           


           

           
           

 

   
   
         
 
  

   

   

Page Side


      

     


         这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中
           


           

           
           

           
           

 

 

Page Side2


   

     


         这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中
           


           

           
           

           
 

 

 

Page Side3


   

     


         这是一行文本,这里作为样例,显示在布局框中

            这是一行文本,这里作为样例,显示在布局框中
           


           

           
           

           
 

   

 

 

        

p5

实例 5 代码:



无标题文档



Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template