html <text>,关于html:使用< br clear = all>的CSS方式

本问题已经有最佳答案,请猛点这里访问。

我曾经在一个DIV的末尾添加,在CSS中没有高度值,来设置它的高度。

分隔符根据内容缩小和增大。

在不使用的情况下,是否有一种更为雄辩的方法可以将所有框的DIV高度设置为最高框的高度?在头脑中露骨的沙发床根据里面的东西来改变高度。

下面是代码示例:

TITLE

Body copy 1

Title 2

Text text text text text text text text

Title 3

Text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text

您的意思是让所有的分隔符具有相同的高度,还是只使用clearfix使父级成为最高分隔符的高度?

分享你的代码

你是说ClearFix?

我在上面添加了代码。谢谢

@Jayx我不想在沙发下面添加内容。有三个高度不同的左侧浮动式沙发床。我想把它们都设置成最高的一级。

最好的方法是停止使用浮动进行布局。

就像你从2006年就直接被冻住了…任何谷歌查询都会给你这个问题的答案。

@GT22使用clear="all"并不能使它们具有相同的高度。你觉得为什么?

@垂直同步感谢您的无用评论。

@Marcosp&;Rezgude感谢您的无用评论。

@GT22任何东西都是无用的,只要你不可能拿它做点什么。:)

@Daanheskes-是的,比如用5秒钟搜索它;)

@垂直同步我该怎么搜索我不知道的东西?像你这样的人是这个网站的真正问题。我来寻求帮助,不是为了听你幼稚的评论。以后提供答案,并尝试帮助海报。它将使你成为一个更好的人和一个更富有成效的网站成员。

@GT22-哇……也许你应该问"如何在谷歌上提问?";)只要谷歌你在标题中写的东西,像css br clear height这样的东西就会产生很多好的结果。

你应该用

因为clear属性被折旧。不过,这不是很有说服力。

实现相同目标的一个更有说服力的方法是使用一个类:

.clear {

clear: both;

}

另一种方法是在包含元素上放置以下类:

.container {

overflow: hidden; /* can also be"auto" */

}

然后是"clearfix"方法,将其放在包含元素上:

.clearfix:after {

content:"";

display: table;

clear: both;

}

您可以在这里阅读更多信息:http://www.sitepoint.com/clearing-floats-overview-different-clearfix-methods/

编辑:如果你想要相同的高度,你的目标是IE10+,你可以使用flexbox。非常简单:http://learnlayout.com/flexbox.html

这里有一个关于flexbox的互动教程:http://cvan.io/flexboxin5/

最好的方法是使用ClearFix方法:

.welcomeText:before, .welcomeText:after {

content:"";

display:table;

}

.welcomeText:after {

clear:both;

}

在CSS的开头,我们使用了一个带有"clear:both"属性的DIV

但是现在有了CSS,我们可以使用类似于DIV中元素的伪元素,而这些元素是用CSS创建的。

你可以阅读任何关于清除浮动的文章。例如:这个例子解释了浮动的问题:http://diywpblog.com/when-and-how-to-use-a-clearfix-css-tutorial/

但这并不是您的回答,因为您希望所有子DIV的高度与父DIV的高度相同。

你可以在父母身上使用display:table,在子女身上使用display:table-cell,但要删除float:left;

谢谢@arnaud gueras,我试试看:)

使用CSS(除非给出固定的高度)自动使DIV具有相同的高度是不可能的。

但是,它使用jquery(使DIV的高度相同):

var heights = [];

$(".houseTiles, .houseTiles2").each(function() {

heights.push($(this).height());

});

var biggestheight = Math.max.apply(null, heights);

$(".houseTiles, .houseTiles2").each(function() {

$(this).css("height",biggestheight);

});

如本XYKDJSFIDLE DEMO所示。

对于具有高度的浮动元素,可以使用以下CSS:

.houseTiles, .houseTiles2 {

display:table;

overflow:hidden;

}

这也清除了浮动,就像你对clear=all或clear:both所做的那样。

好像我误解了问题或者出了什么问题?任何一个有进步而不是直接投反对票的人都是受欢迎的。

你明白这个问题,只是我们不明白,因为问题都是关于清理的…

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值