导航表进入CSS？ [英] Nav table into css?
问题描述
我有一个非常简单的导航菜单在我的页面中间。它是
三个简单链接，它横向排列。为实现这一目标，我使用下表：
< table align = center width =" 40％">
< tr>
< td align = left width =" 13％">< a href ="＃auctionss"> Auctions< / a>< ; / td>
< td align = center width =" 13％">< a href =" gallery.htm">图库< / a>< / td> ;
< td align = right width =" 13％">< a
href =" mailto：Ja ******* *************** @ yahoo.com"> C ontact< / a>< / td>
< / tr>
< / table>
我已经听到你大喊大叫不要用桌子来布局！好吧，
这就是为什么我在这里，因为我无法弄清楚如何实现
以上的布局。不使用桌子。
我尝试了以下内容：
< div style =" text-align：center;">
< div style =" text-align：left;宽度：13％; display：inline;">
< a href ="＃auctionss"> Auctions< / a>
< / div>
< div style =" text-align：center;宽度：13％; display：inline;">
< a href =" gallery.htm"> Gallery< / a>
< / div>
< div style =" text-align：right;宽度：13％; display：inline;">
< a href =" mailto：Ja ********************** @ yahoo .com"> C ontact< / a>
< / div>
< / div>
It在IE浏览器工作但不是Moz。
然后我添加了 http://www.w3.org/TR/html4/loose.dtd 到DTD并且
在两种浏览器中都不起作用，这向我表明它只是
不会工作。 （MS注意：停止修复我的错误！）
有没有办法只使用CSS复制表格布局？
谢谢
Jane Withnolastname< Ja ********************** @ yahoo.com>写在
新闻：p5 ******************************** @ 4ax.com：
我有一个非常简单的导航菜单"在我的页面中间。
它是三个简单的链接，它水平放置。为了实现这一点，我使用了下表：
[snip HTML]
[剪辑CSS]
它在IE中有效但不是Moz。
试试这些网站;他们有关于水平菜单的教程
（以及垂直菜单）：
Listamatic： http://www.maxdesign.com.au/presentation/listamatic/
列表指南：< a rel =nofollowhref =http://www.maxdesign.com.au/presentation/listutorial/target =_ blank> http://www.maxdesign.com.au/presentation/listutorial/
List-o-matic： http://www.accessify.com/tools-and-w...st-o-matic.asp
驯服列表： http://www.alistapart.com/stories/taminglists/
-
Kayode Okeyode
http://www.kayodeok.btinternet.co.uk.../webdesi gn.htm
2001年9月25日星期四04:49:24 GMT，Jane Withnolastname
< Ja ** ********************@yahoo.com>写道：
我有一个非常简单的导航菜单"在我的页面中间。它是三个简单的链接，它是水平放置的。为实现这一目标，我使用了下表：
< table align = center width =" 40％">
< tr>
< td align = left width =" 13％">< a href ="＃auctionss"> Auctions< / a>< / td>
< td align = center width = < 13％">< a href =" gallery.htm">图库< / a>< / td>
< td align = right width =" 13％"> ;< a
href =" mailto：Ja ********************** @ yahoo.com">联系< / a>< / td>
< / tr>
< / table>
我已经听到你大喊不要用桌子用于布局！好吧，这就是为什么我在这里，因为我无法弄清楚如何实现上面的布局。没有使用表格。
看起来好像你试图像我在页面上那样做我的
页面 - 见sig。看看是否有帮助。
-
Stephen Poley
http://www.xs4all.nl/~sbpoley/webmatters/
Jane Withnolastname突然袭击了这个版本并宣布：
[我试图在大约10小时前发布这个帖子;好像已经被吃掉了。]
我有一个非常简单的导航菜单"在我的页面中间。它是三个简单的链接，它是水平放置的。为实现这一目标，我使用了下表：
< snip table>
我已经听到你大喊不要用表格进行布局！
不要使用桌子进行布局！
好吧，
这就是我在这里的原因，因为我无法弄清楚如何实现上面的布局。不使用桌子。
我尝试了以下内容：
< snip try>
CSS：
< style type =" text / css">
#nav {
text-align：center;
}
#nav li {
显示：内联;
list-style-type：none;
填充：0 5％0;
}
< / style>
HTML：
< div id =" nav">
< ul>
< li>< a href ="＃auctions"> Auctions< / a>< ; / li>
< li>< a href =" gallery.htm">图库< / a>< / li>
< li> ;< a href =" mailto：Ja ********************** @ yahoo.com"> C ontact< / a>< / li> ;
< / ul>
< / div>
它在IE中工作但不是Moz。
以上在IE6和Firebird中测试过。
然后我添加了 http://www.w3.org/TR/html4/loose.dtd 到DTD并且它
新文件应该是严格的...
如果你想让它们看起来像按钮（用CSS），那就好了。其他人将
告诉你没有使用mailto： < g>
-
-bts
-这个空间故意留空。
I have a very simple navigation "menu" in the middle of my page. It is
three simple links and it lays out horizontally. To achieve this, I
used the following table:
<table align=center width="40%">
<tr>
<td align=left width="13%"><a href="#auctions">Auctions</a></td>
<td align=center width="13%"><a href="gallery.htm">Gallery</a></td>
<td align=right width="13%"><a
href="mailto:Ja**********************@yahoo.com">C ontact</a></td>
</tr>
</table>
I can already hear you yelling "Don''t use tables for layout!" Well,
that''s why I''m here, because I cannot figure out how to achieve the
above "layout" without using a table.
I tried the following:
<div style="text-align: center;">
<div style="text-align: left; width: 13%; display: inline;">
<a href="#auctions">Auctions</a>
</div>
<div style="text-align: center; width: 13%; display: inline;">
<a href="gallery.htm">Gallery</a>
</div>
<div style="text-align: right; width: 13%; display: inline;">
<a href="mailto:Ja**********************@yahoo.com">C ontact</a>
</div>
</div>
It worked in IE but not Moz.
Then I added http://www.w3.org/TR/html4/loose.dtd to the DTD and it
didn''t work in either browser, which indicates to me that it just
won''t work. (Note to MS: stop fixing my mistakes!)
Is there any way to replicate the table layout using only CSS?
Thanks
Jane Withnolastname <Ja**********************@yahoo.com> wrote in
news:p5********************************@4ax.com:
I have a very simple navigation "menu" in the middle of my page.
It is three simple links and it lays out horizontally. To
achieve this, I used the following table:
[snip HTML]
[snip CSS]
It worked in IE but not Moz.
Try these sites; they have tutorials on Horizontal Menus
(as well as vertical ones):
Listamatic: http://www.maxdesign.com.au/presentation/listamatic/
Listutorial: http://www.maxdesign.com.au/presentation/listutorial/
List-o-matic: http://www.accessify.com/tools-and-w...st-o-matic.asp
Taming Lists: http://www.alistapart.com/stories/taminglists/
--
Kayode Okeyode
http://www.kayodeok.btinternet.co.uk.../webdesign.htm
On Thu, 25 Sep 2003 04:49:24 GMT, Jane Withnolastname
<Ja**********************@yahoo.com> wrote:
I have a very simple navigation "menu" in the middle of my page. It is
three simple links and it lays out horizontally. To achieve this, I
used the following table:
<table align=center width="40%">
<tr>
<td align=left width="13%"><a href="#auctions">Auctions</a></td>
<td align=center width="13%"><a href="gallery.htm">Gallery</a></td>
<td align=right width="13%"><a
href="mailto:Ja**********************@yahoo.com"> Contact</a></td>
</tr>
</table>
I can already hear you yelling "Don''t use tables for layout!" Well,
that''s why I''m here, because I cannot figure out how to achieve the
above "layout" without using a table.
It looks as if you are trying to do the same as I do in the footer on my
pages - see sig. Have a look and see if that helps.
--
Stephen Poley
http://www.xs4all.nl/~sbpoley/webmatters/
Jane Withnolastname pounced upon this pigeonhole and pronounced:
[I tried to post this about 10 hours ago; seems to have gotten eaten.]
I have a very simple navigation "menu" in the middle of my page. It is
three simple links and it lays out horizontally. To achieve this, I
used the following table: <snip table>
I can already hear you yelling "Don''t use tables for layout!"
"Don''t use tables for layout!"
Well,
that''s why I''m here, because I cannot figure out how to achieve the
above "layout" without using a table.
I tried the following: <snip try>
The CSS:
<style type="text/css">
#nav {
text-align: center;
}
#nav li {
display: inline;
list-style-type: none;
padding: 0 5% 0;
}
</style>
The HTML:
<div id="nav">
<ul>
<li><a href="#auctions">Auctions</a></li>
<li><a href="gallery.htm">Gallery</a></li>
<li><a href="mailto:Ja**********************@yahoo.com">C ontact</a></li>
</ul>
</div>
It worked in IE but not Moz.
The above tested in IE6 and Firebird.
Then I added http://www.w3.org/TR/html4/loose.dtd to the DTD and it
New documents should be Strict...
If you want them to look like buttons (with CSS), holler. Others will
tell you about not using "mailto:" <g>
--
-bts
-This space intentionally left blank.
这篇关于导航表进入CSS？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
