他们只是不工作 [英] They just don't work

问题描述

现在是所有优秀网站开发人员使用样式表的时候了。


好​​吧，所以我以明确的意图启动这个商业网站设计

完全使用CSS。 （大约3年我没有尝试过的东西

因为我上次浪费时间试图让它工作）。


网站布局是打算（几乎精确地）从CSS-2规范中看起来像这样：

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning


复制粘贴吧？


错误。


IE不会放置' '正确''正确，并留下丑陋的边缘。后者

很容易解析身体{margin：0px; - 前者是一个很大的问题。


Netscape（和Firebird）。嗯看起来不错......也就是说，直到你填写

''main''< div>使用_actual_内容。


Netscape切断了溢出行，拒绝了整页阅读

的机会。 IE的行为更像你期望的那样，扩展main和

放弃页脚来应对。所以两者都很头疼，

两者都不同。


没关系 - 必须有一个相当简单的方法来调整

样式表在两者中都能正常工作，对吗？


错误。


尝试解决这些问题4-5小时后，我放弃了

使用< table> s在大约20分钟内交叉兼容。


难怪CSS不会被用作打算......它从来没有做过什么。

在锡上说。那不是W3C的错 - 只是一个现实，就像我在IT /网络上工作多年一样。


证明我错了？你可以让它运作吗？


这里开始......


<！DOCTYPE HTML PUBLIC" - // W3C // DTD HTML 4.0 // EN">

< HTML>

< HEAD>

< TITLE>一个框架文档CSS2< / TITLE>

< STYLE type =" text / css">

body {

margin：0px;

}

#header {

位置：固定;

宽度：100％;

身高：50px;

顶部：0px;

右：0px;

底部：自动;

left：0px;

background-color：blue;

}


#sidebar {

位置：固定;

宽度：150px;

身高：自动;

顶部：50px;

右：自动;

底部：20px;

左：0;

背景颜色：红色;

}


#main {

位置：固定;

宽度：自动;

身高：自动;

顶部：50px;

右：0;

底部：20px;

剩余：150px;

背景颜色：绿色;

}

#footer {

位置：固定;

宽度：100％;

身高：20px;

top：auto;

right：0px;

bottom：0px;

left：0px;

背景色：黄色;

}

< / STYLE>

< / HEAD>

< BODY>

< DIV id =" header"> ...< / DIV>

< DIV id =" sidebar"> ...< / DIV>

< DIV id =" main"> ...< / DIV>

< DIV id =" footer"> ...< / DIV>

< / BODY>

< / HTML>


/ k1

解决方案

komone写道：

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

复制粘贴吧？


错了，你必须投入时间和精力学习CSS以及如何使用

它，然后是浏览器的漏洞和缺点学习。

证明我错了？你能让它发挥作用吗？

当然，但你需要学习如何自己捕鱼。 CSS并不容易，

如果你不能马上得到一些东西就不要抱怨。


-

Spartanicus

komone写道：

现在是所有优秀的网络开发人员使用样式表的时候了。


事实上，正确的，他们应该早点开始。

好吧，所以我开始这个商业网站设计的明确意图
完全使用CSS。 （大约3年后我没有尝试过的东西
因为我上次浪费时间试图让它上班）。


如果你不了解东西，你就不会成功。阅读本文：

< http://www.zeldman.com/dwws/>

网站布局旨在（几乎精确地）从< CSS-2规范：

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

复制粘贴，对吧？错误。


正确。 IE不支持固定定位（没有黑客攻击）

IE并没有正确地放置主要，并且留下了丑陋的边缘。后者
很容易解决身体{margin：0px; - 前者是一个很大的头痛。

Netscape（和Firebird）。嗯看起来很好......也就是说，直到你填写
''main''< div>使用_actual_内容。

Netscape切断溢出线，拒绝您阅读整页的机会。 IE的行为更像你期望的，扩展主要和
放弃页脚来应对。因此两者都存在问题并且两者都不同。

没关系 - 必须有一种相当简单的方法来调整
样式表才能在两者中正常工作，对吧？

错了。

尝试解决这些问题4-5个小时后，我放弃并使用< table> s将其构建为交叉兼容大约20分钟。


取决于你的知识，你将需要投入一些时间。

难怪CSS没有按预期使用......它从来没有它在锡上说的是什么。这不是W3C的错 - 只是一个与我在IT / Web工作多年一直存在的现实。


blah blah blah

证明我错了？你可以使它工作吗？

不，但我接近IE中的固定位置（它适用于很多浏览器很多浏览器） ，但它不是完全相同的布局）：

< http://limpid.nl/lab/css/fixed/>

-

Anne van Kesteren

< http://www.annevankesteren.nl/>

你认为4年不是够了吗？


真相是，你不能让它发挥作用。


并且不再告诉我我在抱怨当我不是。它根本就不行。


试试吧。


/ k1


" ; Spartanicus" < [e-mail]>在留言中写道

新闻：lb ******************************** @ news.spart anicus.utvinternet.ie ...

komone写道：

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

错了，你必须花时间和精力去学习CSS以及如何使用
它，然后那里'是浏览器的缺陷和缺点要学习。

证明我错了？你能让它发挥作用吗？

当然，你需要学习如何自己捕鱼。 CSS并不容易，如果你不能立即开始工作，就不要抱怨。

-
Spartanicus

"Now is the time for all good web developers to use stylesheets".

Hmm OK, so I start this commercial site design with the express intent
of using CSS entirely. (Something I haven''t attempted in about 3 years
since I last wasted my time trying to get it to work).

The site layout is intended to look (nearly precisely) like this from
the CSS-2 spec:

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?

Wrong.

IE doesn''t place ''main'' correctly, and leaves ugly margins. The latter
was easily resolvable with body { margin: 0px; } - the former is a big
headache.

Netscape (and Firebird). Hmmm looks OK... that is, until you fill the
''main'' <div> with _actual_ content.

Netscape cuts off the overflow lines, denying your opportunity to read
the full page. IE behaves more like you expect, expanding main and
dropping the footer to cope. So the headache is there in both and
different in both.

Never mind - there must be a reasonably simple way to tweak the
stylesheet to work properly in both, right?

Wrong.

After 4-5 hours of attempting to resolve these issues, I gave up and
built it cross-compatible using <table>s in about 20 minutes.

No wonder CSS doesn''t get used as intended... it never does what it
says on the tin. That''s not the W3C''s fault - just a reality that has
persisted for as many years as I have been working in IT/Web.

Prove me wrong? Can you make it work?

Here''s a start...

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>A frame document with CSS2</TITLE>
<STYLE type="text/css">
body {
margin: 0px;
}
#header {
position: fixed;
width: 100%;
height: 50px;
top: 0px;
right: 0px;
bottom: auto;
left: 0px;
background-color: blue;
}

#sidebar {
position: fixed;
width: 150px;
height: auto;
top: 50px;
right: auto;
bottom: 20px;
left: 0;
background-color: red;
}

#main {
position: fixed;
width: auto;
height: auto;
top: 50px;
right: 0;
bottom: 20px;
left: 150px;
background-color: green;
}

#footer {
position: fixed;
width: 100%;
height: 20px;
top: auto;
right: 0px;
bottom: 0px;
left: 0px;
background-color: yellow;
}
</STYLE>
</HEAD>
<BODY>
<DIV id="header"> ... </DIV>
<DIV id="sidebar"> ... </DIV>
<DIV id="main"> ... </DIV>
<DIV id="footer"> ... </DIV>
</BODY>
</HTML>

/k1

解决方案

komone wrote:

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?
Wrong, you have to invest time and effort to learn CSS and how to use
it, and then there''s the browser bugs and shortcomings to learn.
Prove me wrong? Can you make it work?

Sure, but you need to learn how to fish for yourself. CSS isn''t easy,
don''t start whining if you can''t get something to work immediately.

--
Spartanicus

komone wrote:

"Now is the time for all good web developers to use stylesheets".
Correct, in fact, they should have started earlier.

Hmm OK, so I start this commercial site design with the express intent
of using CSS entirely. (Something I haven''t attempted in about 3 years
since I last wasted my time trying to get it to work).
If you don''t learn about stuff, you won''t succeed. Read this:
<http://www.zeldman.com/dwws/>

The site layout is intended to look (nearly precisely) like this from
the CSS-2 spec:

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?

Wrong.
Correct. IE doesn''t support fixed positioning (without hacks)

IE doesn''t place ''main'' correctly, and leaves ugly margins. The latter
was easily resolvable with body { margin: 0px; } - the former is a big
headache.

Netscape (and Firebird). Hmmm looks OK... that is, until you fill the
''main'' <div> with _actual_ content.

Netscape cuts off the overflow lines, denying your opportunity to read
the full page. IE behaves more like you expect, expanding main and
dropping the footer to cope. So the headache is there in both and
different in both.

Never mind - there must be a reasonably simple way to tweak the
stylesheet to work properly in both, right?

Wrong.

After 4-5 hours of attempting to resolve these issues, I gave up and
built it cross-compatible using <table>s in about 20 minutes.
Depends on your knowlodge, you will have to invest some time.

No wonder CSS doesn''t get used as intended... it never does what it
says on the tin. That''s not the W3C''s fault - just a reality that has
persisted for as many years as I have been working in IT/Web.
blah blah blah

Prove me wrong? Can you make it work?

Nope, but I came close with fixed postioning in IE (it works in quite a
lot of browsers, but it is not the exact same layout):
<http://limpid.nl/lab/css/fixed/>
--
Anne van Kesteren
<http://www.annevankesteren.nl/>

You think 4 years isn''t enough?

Truth is, you can''t make it work.

And stop telling me I''m whining when I''m not. It simply won''t work.

Try it.

/k1

"Spartanicus" <[e-mail]> wrote in message
news:lb********************************@news.spart anicus.utvinternet.ie...

komone wrote:

http://www.w3.org/TR/REC-CSS2/visure...ed-positioning

Copy-paste, right?

Wrong, you have to invest time and effort to learn CSS and how to use
it, and then there''s the browser bugs and shortcomings to learn.

Prove me wrong? Can you make it work?

Sure, but you need to learn how to fish for yourself. CSS isn''t easy,
don''t start whining if you can''t get something to work immediately.

--
Spartanicus

这篇关于他们只是不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！