masyarakat
Belajar
Perpustakaan Alatan
Alat AI
Masa lapang
cari
Melayu
Rumah > hujung hadapan web > html tutorial > DIV+CSS布局示例_html/css_WEB-ITnose

DIV+CSS布局示例_html/css_WEB-ITnose

WBOY
Lepaskan： 2016-06-24 12:30:40
asal
1160 orang telah melayarinya

第一种:左菜单右边内容自动变宽的布局

Code

Code


    

    
banner

    
nav

    

    

    

    

    测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符
    测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符
    测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符
    测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符
    测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符
    测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符测试字符v


再宽也不会自动换行了

    

    

    

    menu
    

    

       

    foot
    

    

 

第二种，页宽度固定，分栏显示内容

 

Code


    

    

    
header

    
banner

    

    

    

    

    
Left

    

    

    

    Right
    

    

    

    
Right

    

    

    

    
    

 

 

Label berkaitan：
DIV+CSS布局示例
sumber：php.cn
Artikel sebelumnya：纯DIV+CSS实现圆角！_html/css_WEB-ITnose Artikel seterusnya：div css 常用技巧_html/css_WEB-ITnose
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Buat susun atur kad yang pelbagai menggunakan grid tunggal atau Flex: panduan praktikal Saya cuba membuat susun atur kad responsif seperti dalam gambar. Apa yang saya lakukan pad...
daripada 2024-04-02 21:07:36
0
2
377
Jarak fleksibel rosak apabila cuba melimpahi teg <pre><code> HTML dan bukannya membalut Saya menggunakan CSS pada pemilih prakod untuk membuat blok kod gaya seperti yang anda aka...
daripada 2024-04-01 12:22:06
0
1
296
Bolehkah CSS memaparkan garisan grid? Saya mula belajar susun atur grid CSS. Dalam dunia yang ideal, saya akan dapat menyediakan...
daripada 2024-03-31 20:38:21
0
2
395
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan