为何漂浮? [英] Why float?

查看:96
本文介绍了为何漂浮?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述




虽然看起来好像我在快速继续发布随机帖子这个问题确实是我想到的事情

时间没有得出结论:


为什么大多数专业的CSS作者更喜欢/ float / ing元素

结束元素由位置/位置/?


给出,例如,给出以下布局......


+ ----- ------------ +

| 1 |

+ --- + ------------- +

| | |

| 2 | 3 |

| | |

+ --- + ------------- +


....(1)有一些已知(比如5em)身高和(2)有一些

已知宽度(比如说5em)我不知道为什么我应该将浮动应用于(2)和

(3)而不是仅仅将(3)定位到{+ 5em,+ 5em}。


在尝试找到背后的问题时,我读到的内容越多

/ float /,我找到了破解

CSS实现所需的更多变通方法,技巧和怪癖 - 所以为什么/ float /优于

/ position /?

请赐教:-)




解决方案

" Wolfgang Meier" < WO *** @ sofort-mail.de>写道:

为什么/ float /优于/ position /?




谁说它是苹果,或者苹果和梨甚至可以在这样的优惠/更差的分类中排名吗?


用于创建CSS的用途布局是第二种费率

选择,最不适合创建CSS的方法。布局是一个CSS

表。 最不适合的因为与CSS 2.x一起使用的CSS表是

本身是一个很差的工具来创建适合网络的布局,但是

CSS 2.x没有提供机制创建高质量的网页布局。


人们通常使用花车或定位来创建CSS。布局

因为IE不支持CSS表。浮动和定位

从根本上不适合创建高质量的Web布局,但如果代码需要在IE中工作,它们只有两个可用的CSS方法。

方法都会产生基本问题(不包括错误),这些问题应该进行广泛的检查,并权衡可能提供语义的b $ b优势正确的布局。


我说潜力因为使用IE兼容的实际优势

" CSS"在大多数情况下,可以想象布局而不是HTML表格,这是一厢情愿的结果,在现实中通常为空。


使用CSS布局已经成为荣誉的象征,在新闻组中,蔑视的人可以免除蔑视。

" enlightened"具有CSS布局的灵魂意识到使用诸如浮动

等基本不合适的方法以及创建布局的定位所带来的负面影响。

-

Spartanicus


Spartanicus写道:

很少有开明的具有CSS布局的灵魂
意识到使用这种基本上不合适的方法(例如浮动和定位)来创建布局的负面影响。




有趣的理论,请详细说明!


无论如何,问题仍然存在。我不是在寻找理论上最好的解决方案,而是最好的解决方案。实际解决方案对我来说,似乎像大多数作者一样认为/ float / ing元素是最实用的解决方案,我只是想知道为什么。


" Wolfgang Meier" < WO *** @ sofort-mail.de>写道:

很少有开明的具有CSS布局的灵魂
意识到使用这种基本上不合适的方法(如浮动和定位)来创建布局的负面影响。
有趣的理论,请详细说明!



浮动和定位布局框都无法包含其内容,

如果内容不适合布局框内容将

溢出,被剪切或导致视口内的滚动条,没有一个是基本质量布局机制可接受的行为。


清除水平放置在水平相邻的布局框内的浮动
a浮动布局框导致非浮动布局框移动

浮动布局框下方。这可以被黑客攻击,但浮动为

a布局方法已经失败了另一个基本要求:布局

框(及其内容)应该与其他内容中的内容隔离/>
布局框。


如果

下面放置另一个定位框,则无法包装绝对定位框的内容因为它将

重叠该框的内容。不允许内容包装原因

水平滚动条,一个不必要的强加给用户。


当被滥用来创建布局时,浮动对在屏幕上放置内容和/或导致内容订单问题的地方施加限制。


浮动和定位都无法创建基本布局

格式:相互依赖地垂直扩展的列取决于

它们的内容。


CSS float属性旨在替换HTML对齐属性。

这是有意的,唯一正确的用法是将像图像元素一样的元素移动到一边,并在其下方及其下方放置文本流。所有其他用途都是

从根本上说是不恰当的黑客攻击导致上述问题。

无论如何,问题仍然存在。我不是在寻找最好的理论上可行的解决方案,而是最好的解决方案。实用的解决方案。




然后使用HTML表,除非你对CSS非常熟练,否则完全理解浮动的含义和/或定位CSS布局,

你可以提出一个有效的理由,为什么使用HTML表格

对你的用户(最不可能)是坏的,对这样的它的价值超过了定位或浮动的CSS布局的缺点。


以上的一个例外是如果网站的主要目的是 b你可以尝试使用CSS来提高你的技能和/或

对技术的理解。


- < br $>
Spartanicus


Hi,

Although it might seem like I am firing out random posts in quick
succession this matter is indeed one I thought about for quite some
time without coming to a conclusion:

Why is it that most professional CSS authors prefer /float/ing elements
over elements held in place by /position/?

Given, for example, the following layout...

+-----------------+
| 1 |
+---+-------------+
| | |
| 2 | 3 |
| | |
+---+-------------+

....with (1) having some known (say 5em) height and (2) having some
known width (say 5em) I don''t see why I should apply float to (2) and
(3) instead of just positioning (3) to {+5em, +5em}.

While trying to find the issue behind this, the more I read about
/float/, the more workarounds, tricks and quirks necessary for broken
CSS implementations I found -- so just why is /float/ better than
/position/?
Please enlighten me :-)

Wolf

解决方案

"Wolfgang Meier" <wo***@sofort-mail.de> wrote:

why is /float/ better than /position/?



Who says that it is, or that apples and pears can even be ranked in such
a better/worse classification?

Either usage for the purpose of creating a "CSS" layout is a second rate
choice, the least unsuitable method to create a "CSS" layout is a CSS
table. "Least unsuitable" since a CSS tables when used with CSS 2.x are
in themselves a poor tool to create a layouts suitable for the web, but
CSS 2.x offers no mechanism to create good quality web layouts.

People commonly use floats or positioning to create a "CSS" layout
because IE doesn''t support CSS tables. Floating and positioning are
fundamentally unsuitable for creating a quality web layout, but they are
the only two CSS methods available if the code needs to work in IE. Both
methods create fundamental problems (bugs not included), these problems
should be extensively examined and weighed against the potential
advantage offering a semantically correct layout.

I say potential because the actual advantage of using an IE compatible
"CSS" layout instead of a HTML table is imagined in most cases, the
result of wishful thinking, and typically null in reality.

Using a "CSS" layout has become a badge of honour, bearers are exempt
from scorn being poured over them in newsgroups. Few of the
"enlightened" souls with their CSS layouts are aware of the negative
effects of using such fundamentally unsuitable methods such as floating
and positioning for creating a layout.

--
Spartanicus


Spartanicus wrote:

Few of the "enlightened" souls with their CSS layouts
are aware of the negative effects of using such fundamentally
unsuitable methods such as floating and positioning for creating a layout.



Interesting theory, please go into detail!

Anyway, the problem remains. I''m not looking for the best theoretically
possible solution but the "best" practical solution. To me, it seemed
like most authors regard /float/ing elements as the best practical
solution and I just wondered why.


"Wolfgang Meier" <wo***@sofort-mail.de> wrote:

Few of the "enlightened" souls with their CSS layouts
are aware of the negative effects of using such fundamentally
unsuitable methods such as floating and positioning for creating a layout.
Interesting theory, please go into detail!



Both floated and positioned layout boxes fail to contain their content,
if that content doesn''t fit in the layout box the content will either
overflow, be clipped, or cause scroll bars inside the viewport, none are
acceptable behaviour for a basic quality layout mechanism.

Clearing a float within a layout box positioned horizontally adjacent to
a floated layout box results in the non floated layout box to be moved
below the floated layout box. This can be hacked around, but floating as
a layout method has already failed another basic requirement: layout
boxes (and their content) should be isolated from content in other
layout boxes.

The content of an absolutely positioned box cannot be allowed to wrap if
there is another positioned box placed directly below it as it will
overlap the content of that box. Not allowing content to wrap causes
horizontal scroll bars, an unnecessary irk to impose on the user.

When abused to create a "layout", floating imposes restrictions on where
to place content on screen, and/or causes content order problems.

Both floating and positioning are incapable of creating a basic layout
format: columns that expand vertically interdependently depending on
their content.

The CSS float property was intended to replace the HTML align attribute.
It''s intended and only proper usage is to move an element like an image
to one side and have text flow next and beneath it. All other uses are
fundamentally inappropriate hacks that cause the aforementioned
problems.
Anyway, the problem remains. I''m not looking for the best theoretically
possible solution but the "best" practical solution.



Then use a HTML table, unless you are highly skilled with CSS, perfectly
understand the implications of a floated and/or positioned CSS layout,
and you can come up with a valid reason as to why using a HTML table
would be bad for your users (most unlikely), to such an extent that it
outweighs the disadvantages of positioned or floated CSS layouts.

The one exception to the above would be if the site''s primary purpose is
for you to experiment with CSS to further your skills and/or
understanding of the technology.

--
Spartanicus


这篇关于为何漂浮?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆