社区
学习
工具库
AI工具
休闲
搜索
简体中文
首页 > web前端 > html教程 > DIV+CSS布局示例_html/css_WEB-ITnose

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

WBOY
发布： 2016-06-24 12:30:40
原创
1161 人浏览过

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

Code

Code


    

    
banner

    
nav

    

    

    

    

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


再宽也不会自动换行了

    

    

    

    menu
    

    

       

    foot
    

    

 

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

 

Code


    

    

    
header

    
banner

    

    

    

    

    
Left

    

    

    

    Right
    

    

    

    
Right

    

    

    

    
    

 

 

相关标签：
DIV+CSS布局示例
来源：php.cn
上一篇：纯DIV+CSS实现圆角！_html/css_WEB-ITnose 下一篇：div css 常用技巧_html/css_WEB-ITnose
本站声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
使用单个网格或 Flex 创建多样化的卡片布局：实用指南 我正在尝试制作如图所示的响应式卡片布局。目前我正在做的是分别为计算机、平板电脑和移动设备创建布局。然后在media查询的帮助下，我将其他两个视图的显示属性设置为display:no...
来自于 2024-04-02 21:07:36
0
2
377
尝试溢出 HTML <pre><code> 标签而不是换行时，Flex 间距被破坏 我将CSS应用到precode选择器，以便制作样式代码块，就像您在GitHub或其他地方看到的那样。我使用Flexbox进行布局，并且在“框”div内并排有两个“面板”div，其中...
来自于 2024-04-01 12:22:06
0
1
296
CSS 可以显示网格线吗？ 我开始学习CSS的网格布局。在理想的情况下，我将能够设置一个div多个网格框，并将我的元素精确地放置在其中，在需要时提供叠加（有点像在Illustrator中使用粘在网格上）。如果...
来自于 2024-03-31 20:38:21
0
2
395
相关专题
更多>
热门推荐
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板