`
redloves
  • 浏览: 21600 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

CSS+DIV排版时容器内对象全部设置了float属性后容器不能自动适应高度的解决方案

CSS 
阅读更多

当一个DIV容器中的所有对象都设置了float属性后,容器不能自动适应高度。

解决的方法有两个:

  1. 在容器的最后添加一个空的DIV标签,设置其样式clear:both,然后隐藏这个DIV。
  2. 设置容器的样式overflow:hidden/auto以及zoom:1(zoom属性是为了兼容IE6)。
分享到:
评论

相关推荐

    精美网页CSS+DIV排版

    在“精美网页”中,CSS+DIV排版的关键在于以下几个方面: 1. **布局模式**:使用CSS的盒模型(Box Model),包括内边距、边框和外边距,可以调整元素的大小和位置,创建各种布局模式,如流式布局、网格布局、响应式...

    DIV+CSS布局:CSS浮动float属性详解[归纳].pdf

    当该属性不等于none时,对象将被视作块对象(block-level),即display属性等于block。也就是说,浮动对象的display特性将被忽略。 Float浮动属性的参数 float属性有三个参数:none、left和right。 * none:对象...

    CSS+DIV 布局网站实例

    - 浮动布局:通过设置`float`属性,使元素在父容器内左右浮动,常用于创建多列布局。 - 盒模型:理解盒模型是CSS布局的关键,它包括内容区、内边距、边框和外边距。通过调整这些属性,可以精确控制元素的尺寸和...

    CSS+DIV标准教程

    【CSS+DIV标准教程】是一门深入探讨网页布局与设计的课程,主要针对网页开发者,旨在通过实例教学,使学习者掌握使用CSS(层叠样式表)和DIV(定义文档分区)进行高效、灵活的网页排版技巧。CSS是用于控制网页外观和...

    CSS+div基础知识的ppt文档

    3. **属性与值**:CSS通过属性和对应的值来设置样式,例如`color`属性可以设置文字颜色,`font-size`属性可以设定字体大小。 4. **层叠规则**:CSS中的“层叠”意味着当多个样式规则应用于同一个元素时,会按照...

    div+css排版学习与提高

    在网页设计领域,Div+CSS布局是现代网页开发的基础,它极大地提升了网页的可维护性和适应性。"div+css排版学习与提高"这个主题旨在帮助初学者和进阶者掌握这一关键技术,以实现更加符合W3C标准的网页布局。 首先,...

    一个不错的DIV+CSS排版

    例如,通过设置`float:left`或`float:right`可以使`div`元素左右排列,而`display:flex`或`display:grid`则提供了更现代的布局解决方案。 此外,`CSS`还支持盒模型,这是一个理解`div`尺寸计算的关键概念。盒模型...

    css+div 实例 一共十一章

    浮动(`float`)和清除(`clear`)用于创建流式布局,而Flexbox和Grid布局提供更为灵活的二维布局解决方案。 6. **响应式设计**:随着移动设备的普及,响应式设计变得至关重要。通过媒体查询(`@media`)可以实现...

    div+csspdf版

    在IT行业中,网页设计是至关重要的一个领域,而"Div+CSS"是构建现代网页布局的基础。本资源包“div+csspdf版”显然聚焦于这个主题,包含了两个关键文件:`css2.0中文手册.chm`和`DIV+CSS布局大全.pdf`。这两个文件都...

    div+css博客

    通过设置`div`的`class`或`id`属性,我们可以用CSS来定位和定制每个区域的样式。 接下来,CSS是控制网页外观的关键。它可以定义字体、颜色、布局、动画等众多视觉特性。在这个“div+css博客”中,开发者可能使用CSS...

    DIV+CSS二行五列图片排版

    在CSS中,我们可以为这些`<div>`设置宽度、高度、边距等属性,以实现特定的布局。 接下来,我们来看`CSS`如何帮助我们实现二行五列的布局。有几种方法可以做到这一点,但最常见的是使用浮动(float)和Flexbox布局...

    DIV排版

    通过设置CSS属性如宽度、高度、边距、内边距,我们可以精确地控制网页内容的布局。 二、DIV排版的优势 1. **结构化**:使用DIV可以让网页结构更加清晰,有利于SEO(搜索引擎优化),便于代码理解和维护。 2. **灵活...

    经典全套DIV+CSS实例

    【压缩包子文件的文件名称列表】"DIV+CSS模板"意味着这个压缩包内可能包含了一系列已完成的`div+css`设计模板,每个模板都代表一个特定的设计概念或功能,如头部、导航栏、内容区域、侧边栏、页脚等。通过分析和模仿...

    2天掌握DIV+CSS网页制作技术

    【网页技术】——快速掌握DIV+CSS网页制作技术 网页制作技术中,"DIV+CSS"是一个常见的术语,但它实际上并不准确。正确的表述应该是xHTML+CSS,这是一套遵循Web标准的页面构建方法,旨在将内容(结构)、样式(表现...

    DIV+CSS案列源代码04

    在本案例中,我们可能会看到如何使用CSS控制`<div>`的宽高、颜色、边距、内边距、背景、字体等属性,以实现美食图片的展示、菜单分类的布局以及信息的排版。 美食主题的网站可能包括以下元素的CSS设计: 1. **图片...

    DIV+CSS属性设置参数.pdf

    本文将详细解析`DIV+CSS`中的各种属性设置参数,这些参数是构建网页布局和美化页面的关键元素。我们将逐一探讨行距、背景图像、宽度、高度、最大字符数等核心概念,并深入讲解各种排版、定位、字体样式、文本装饰...

    DIV+CSS布局

    4. **强大的排版能力**:相比于传统的`<table>`布局,DIV+CSS提供了更多样化的排版选项,使得设计更加灵活。 5. **表现与内容分离**:将页面的表现形式与内容完全分开,降低了因样式问题导致页面显示异常的风险。 6....

    css排版技巧 实用

    ### CSS排版技巧详解 #### 一、引言 随着网页设计标准的不断提升与浏览器兼容性的改善,越来越多的网站设计者开始放弃传统的表格布局方法,转而采用更加灵活且易于维护的CSS(层叠样式表)进行网页排版。本文将...

    DIV+CSS的几种标准网页模板

    在网页设计领域,DIV+CSS是一种广泛采用的技术,用于构建高效、可维护的网页布局。这个压缩包文件“CSS+DIV模板”包含了多种常见的网页模板,如相册、清新风格、简洁风格、游戏主题、星座主题、网上超市以及博客模板...

Global site tag (gtag.js) - Google Analytics