寻求CSS布局的方法建议 [英] Seeking How-To Advice on CSS Layout

查看:70
本文介绍了寻求CSS布局的方法建议的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述




我希望有人可以帮助我。我是第一次

尝试使用CSS而不是HTML

表来实现页面设计。


我'已经能够完成大部分页面了。我的标题区域是

,低于3列。


我的问题在标题区域内。


我想要的是以下内容:


********

* .Logo。*

* .Logo。* ******** ********

* .Logo。* * Image1 * * Image2 *

* .Logo 。* ******** ********

* .Logo。*此处有一行文字

* .Logo。*

* .Logo。* NavBtn1 NavBtn2 NavBtn3

********

你可以在这里看到我的实际页面:
http://www.chicagospace.org/testarea/Skel1.html


我的问题是,因为我正在使用浮动,文本行和

导航按钮包含在图像的右侧

出现在两个图像下方 - image1和image2。我尝试过的所有东西都失败了。通常我的解决方案会导致文本和导航按钮的行向下移动到内容区域。


任何建议都会非常感激。


谢谢。


请将您的回复发布到该群组,因为该电子邮件地址是假的

箔垃圾邮件发送者。


最诚挚的问候,吉姆
http:/ /www.chicagospace.org/

推荐答案

2006年4月3日星期一19:25:15 -0500,Jim< Ji *@nospamwanted.com>写道:
On Mon, 03 Apr 2006 19:25:15 -0500, Jim <Ji*@nospamwanted.com> wrote:


我希望有人可以帮助我。我是第一次尝试使用CSS而不是HTML
表来实现页面设计。

我已经能够完成大部分页面了。我有标题区域
,下面有3列。

我的问题在标题区域内。

我想要的是以下内容:

********
* .Logo。*
* .Logo。* ******** ********
* .Logo。* * Image1 * * Image2 *
* .Logo。* ******** ********
* .Logo。*这里有一行文字
* .Logo。*
* .Logo。* NavBtn1 NavBtn2 NavBtn3
********

您可以在这里看到我的实际页面:
http://www.chicagospace.org/testarea/Skel1.html

我的问题是,因为我正在使用浮动,文本行和导航按钮包含在图像的右侧,而不是出现在图像的右侧在两个图像下面 - image1和image2。我尝试过的所有东西都失败了。通常我的解决方案会导致文本和导航按钮的行向下移动到内容区域。

任何建议都将非常感谢。

谢谢。

请将您的回复发布到论坛,因为电子邮件地址是伪造的,以阻止垃圾邮件发送者。
Hi,

I am hoping that someone here can help me out. I am for the first time
trying to implement a page design using only CSS instead of HTML
tables.

I''ve been able to get most of the page done ok. I have my header area
and below it 3 columns.

My problem is within the header area.

What I want is the following:

********
*.Logo.*
*.Logo.* ******** ********
*.Logo.* *Image1* *Image2*
*.Logo.* ******** ********
*.Logo.* A line of text here
*.Logo.*
*.Logo.* NavBtn1 NavBtn2 NavBtn3
********
You can see my actual page here:
http://www.chicagospace.org/testarea/Skel1.html

My problem is that because I''m using floats, the line of text and
navigation buttons wrap up to the right of the images instead of
appearing below the two images - image1 and image2. Everything that I
have tried has failed. Typically my solutions would result in the line
of text and nav buttons getting shifted down into the content area.

Any suggestions would be greatly appreciated.

Thanks.

Please post your reply to the group as the email address is a fake to
foil spammers.




我好像有部分问题解决了。代码:
http://www.chicagospace.org/ testarea / Skel2.html


确实产生了我想要的结果,前提是我没有将文字大小调整为<​​br />
更大的尺寸,强制导航按钮进入内容

区域。


Skel2.html中的解决方案是否可行?


谢谢。


最诚挚的问候,吉姆
http://www.chicagospace.org/


Jim写道:
Jim wrote:
我好像解决了部分问题。代码:
http://www.chicagospace.org/ testarea / Skel2.html

会产生我想要的结果,前提是我没有将文本调整为更大的尺寸,这会强制导航按钮进入<内容区域。
I seem to have part of the problem solved. The code at:
http://www.chicagospace.org/testarea/Skel2.html

does produce the results I want provided I don''t resize the text to a
larger size, which forces the navigation buttons down into the
content area.




调整大小会破坏您的设计。我将你的hdr的155px高度更改为:


div#hdr {height:13em;


并解决了这个问题。你不应该将px用于那种

大小调整。使用em的某些值而不是调整大小不会成为问题。


哦,考虑放弃Verdana。
http://www.xs4all.nl/~sbpoley/webmatters/verdana.html


-

-bts

-警告:我为草坪鹿刹车



Resizing blows your design. I changed the 155px height of your hdr to:

div#hdr {height:13em;

and solved that one problem. You shouldn''t use px for that kind of
sizing. Use some value of em instead and resizing won''t be a problem.

Oh, and consider dropping Verdana.
http://www.xs4all.nl/~sbpoley/webmatters/verdana.html

--
-bts
-Warning: I brake for lawn deer


>
我似乎解决了部分问题。代码:
http://www.chicagospace.org/ testarea / Skel2.html

会产生我想要的结果,前提是我没有将文本调整为更大的尺寸,这会强制导航按钮进入内容
区域。

Skel2.html的解决方案是否可行?

谢谢。

最诚挚的问候,吉姆
http://www.chicagospace.org/
I seem to have part of the problem solved. The code at:
http://www.chicagospace.org/testarea/Skel2.html

does produce the results I want provided I don''t resize the text to a
larger size, which forces the navigation buttons down into the content
area.

Is the solution in Skel2.html the way to go?

Thanks.
Best Regards, Jim
http://www.chicagospace.org/



嗨吉姆


看起来问题类似于quirksmode上描述的问题

http://www.quirksmode.org/css/clearing.html

我的理解是你需要从

div#hdr中删除高度设置然后添加溢出:隐藏到相同然后你的

hea当文字大小增加时,der会扩大。


希望这会有所帮助


问候,

Tim



Hi Jim

Looks like the problem is similar to one described on quirksmode

http://www.quirksmode.org/css/clearing.html

My understanding is that you need to remove the height setting from
div#hdr altogether then add overflow:hidden to the same and then your
header will expand when the text size is increased.

Hope this helps

Regards,
Tim


这篇关于寻求CSS布局的方法建议的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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