解决css的float父div没有高度 - - ITeye博客

`

zerxd

浏览: 73702 次
性别:
来自: 厦门

最近访客更多访客>>

devcang

kalin001

lizardchao

Dazui0913

博主相关

博客

微博

相册

收藏

留言

关于我

文章分类

社区版块

存档分类

最新评论

shenjichao2009：请问你理解如何使用g++吗？如何将使用C++编写的代码打包成s ...
g++编译命令选项
nbsven：难道没人用过UFOUpload组件，gm365.com上发布的 ...
SmartUpload的一些改进

解决css的float父div没有高度

阅读更多

在做页面设计常会碰到css的float父div没有高度的情况，HTML代码设计
view plaincopy to clipboardprint?
<div class='box'>
<div class='float_left'></div>
<div class='float_right'></div>
</div>
在CSS里定义了如CLASS类这样的浮动后，你会发现父div名box没有高度，所以又时候你可能感觉到父div的margin没有效果，这种情况下，你只需要给父div加个overflow:hidden就可以了，譬如
.box{overflow:hidden}

W3C OVERFLOW

分享到：

水平居中的CSS实现 | MySQL字段数据类型/长度及表类型详细说明

2010-08-29 15:37
浏览 1478
评论(0)
分类:Web前端
查看更多

评论

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

子div含float，父div高度自适应的div+css布局写法: div+css高度自适应网页布局，子div含float，父div高度自适应，已经通过测试的浏览器：ie6、ie7、ie8、火狐、Chrome。代码来源： http://www.positioniseverything.net/articles/onetruelayout/equalheight

css1--关于float的div撑不起父div的问题: 然而，使用`float`时常常会遇到一个常见的问题，即浮动元素（float div）无法撑起其父元素的高度，导致父元素高度塌陷。这个问题在前端开发中很常见，尤其是在早期的网页布局设计中。本篇将详细探讨这个问题，并提供...

div+css float 布局，适配手机: 在高洛峰老师的 `div+css` 视频教程中，他可能详细讲解了如何创建浮动布局，包括设置 `div` 的宽高、设置 `float` 属性、清理浮动（clear floats）以防止父元素高度塌陷，以及如何使用媒体查询进行响应式设计。...

float元素浮动后高度不一致导致错位的解决办方法: 但是当高度不一致时，就需要想别的办法来解决了： 1、给父元素定义font-size:0; 浮动子元素定义需要的font-size，再定义display:inline-block;vertical-align:top; 复制代码代码如下: ul{ margin:0; padding:0; ...

CSS浮动属性Float详解什么是CSS Float？: 空 div 方法是使用一个空的 div 元素来清除 Float，而 overflow 方法是使用 overflow 属性来扩展父元素以包含浮动。 Float 属性是 CSS 中非常重要的一部分，掌握 Float 属性可以帮助我们创建复杂的网页布局。但是，...

html div没有被撑开的原因及解决办法: 以上就是`html div没有被撑开的原因及解决办法`的主要内容。在实际开发中，遇到此类问题时，应首先分析CSS代码，找出可能影响`div`高度的因素，然后根据上述解决方案进行调整。同时，理解并掌握CSS布局的基本原则...

CSS教程：div设置float后高度不自动增加: 因为从这个题目我们可以更加容易的看出，如果您没有闭合(清除)浮动元素，它将造成的后果是—–div的高度不能自动增加。言归正传目前用来清除“闭合(清除)浮动”的方法，主要是一下四种：1.额外标签法这种方法就是向...

DIV+CSS布局：CSS浮动float属性详解[归纳].pdf: CSS浮动float属性详解在Web开发中，布局是非常重要的一方面，浮动float属性是CSS布局中非常关键的属性。通过对浮动float属性的理解和掌握，我们可以更好地实现网页的布局和排版。 Float浮动属性基本释义 float...

css 简单例子 div css 简单例子 div: /* 设置div的高度 */ background-color: #f00; /* 设置背景颜色为红色 */ margin: 10px; /* 设置外边距，让div与其他元素保持一定的距离 */ padding: 20px; /* 设置内边距，增加div内部内容与边框之间的空间 */ ...

div+css手册: 《div+css手册》是一本深入探讨网页布局技术的重要参考资料，尤其对于网页设计者和前端开发者来说，它具有极高的学习价值。这个手册的核心聚焦在HTML中的`div`元素和CSS（层叠样式表）的结合使用上，旨在帮助读者...

css+div网页模板整站: 《CSS+Div网页模板整站解析》在网页设计领域，CSS（层叠样式表）与Div元素的结合是构建现代网页布局的核心技术。本资料集合包含了一个完整的网站模板，由十个不同页面组成，旨在为网页设计师提供实用的参考和学习...

div+css布局大全: `<div>`元素本身没有特定的语义，它的主要价值在于组织内容和应用样式。 2. **CSS（Cascading Style Sheets）**：CSS是一种样式表语言，用于描述HTML或XML（包括如SVG、MathML等各种XML方言）文档的呈现。CSS控制了...

CSS3+DIV网页样式与布局从入门到精通（未来科技）源代码: ### CSS3+DIV网页样式与布局从入门到精通——核心知识点解析 #### 一、CSS3简介 **CSS3**（Cascading Style Sheets Level 3），即层叠样式表第3级，是用于增强HTML文档表现力的一种样式语言。CSS3在CSS2的基础上...

精通css+div: 这一章将深入讲解Div的使用，包括如何创建和定位Div，以及如何通过CSS属性（如display、position、float等）实现流式布局、网格布局和相对/绝对定位。同时，还会涉及Div的嵌套和组合，以实现复杂页面结构。 **第8章...

Div+CSS 样式的使用演示: 但需要注意的是，浮动可能会导致父元素的高度塌陷，因此需要使用清除浮动（Clear Fix）来解决这个问题。一种常见的清除浮动的方法是使用伪类`::after`： ```css .clearfix::after { content: ""; display: table;...

css float浮动属性使用方法和实例讲解: css float是一个经常需要使用的css属性，该属性用于设置css...float的作用：通过css定义float（浮动）让div样式层块，向左或向右（靠）浮动。本文通过实用案例创建一个水平菜单，使用浮动来创建水平菜单的超链接列表。

精通CSS与DIV资源管理及素材: 3. **浮动与定位**：CSS的浮动（float）属性常用于创建多列布局，而定位（position）属性（如`static`、`relative`、`absolute`和`fixed`）则允许元素相对于其正常流或父元素进行定位。 4. **响应式设计**：随着...

css+div自适应窗口宽度: 总的来说，CSS+div自适应窗口宽度主要依靠`min-width`, `width`, `float`和百分比单位等属性来实现。通过合理的布局和JavaScript辅助，可以创建出适应不同屏幕尺寸的响应式网页，确保在各种设备上提供良好的用户体验...

Global site tag (gtag.js) - Google Analytics