CSS网页布局入门教程12：纵向导航菜单

共有 31 位网友发表了评论　我要评论..

munglan(220.168.*.*) 发表于：2010-09-21 02:24:24

请问这个代码中h1标签多次使用，我在网上看说h1标签多次使用不太好，这是为什么呢？

管理员回复：从搜索引擎优化角度来讲，h类标签的权重较高，如果用的多可能会让搜索引擎误认为在滥用。本例主要讲解标签的灵活运用

wangjianghua(222.210.*.*) 发表于：2010-06-11 15:04:20

请问站上，怎么不用<ul>\<li>做呢？

管理员回复：本例也是在讲标签的灵活运用

Mcbag(112.94.*.*) 发表于：2010-05-26 19:53:00

#nav h2 a { color:#666666; text-decoration:none;} #nav h2 a:hover { color:#999999; text-decoration:underline;} 站长您好，辛苦了，这段代码，大部分都懂，就这两句不知道什么意思，麻烦您给我解释，先谢了。我是个新手。

管理员回复：链接的样式，和鼠标移到链接上的样式

menghuanyuting(124.65.*.*) 发表于：2010-05-11 17:34:44

非常感谢管理员，又学会了一节课，原来h1,h2还有这种功能，真是太神奇了。但是h1，h2如果做成外部引用CSS文件的话，是不是就有一定的局限性了，如果是用它们来控制整个网站的标题的话，就不能用来控制导航了吧？要么就是标题再重新写其它的命名样式。外部的两个CSS文件里不能分别定义h1,h2的属性吧，名字相同是不是会有冲突了？

管理员回复：是的

zl290405302(113.80.*.*) 发表于：2010-05-08 09:31:05

请问管主，导航栏居左，占据了整条，右侧就不能显示内容了，需要进行哪里的修改？

管理员回复：不明白

ai68738651(58.246.*.*) 发表于：2010-05-07 15:43:41

站长你太好了！上面那个居中的问题你可以这样写：#nav { width:100px; border-color:#c5c6c4; border-style:solid; border-width:0px 1px 1px 1px;} #nav h1 { margin:0px; padding:4px; font-size:12px; font-weight:bold; font-family:Verdana; border-top:1px solid #c5c6c4; background-color:#CCCCCC; text-align:center;} #nav h2 { margin:0px; padding:4px; font-size:12px; font-family:Verdana; font-weight:normal; text-align:center;} #nav h2 a { color:#666666; text-decoration:none; text-align:center;} #nav h2 a:hover { color:#999999; text-decoration:underline;}

fenghuazh(218.65.*.*) 发表于：2010-03-23 17:17:24

现在明白margin 和padding的区别了， margin是模块和模块之间的距离，按照我的理解这里的模块应该就是对象，比如说border对象等等，padding是内容和模块之间的距离，希望我的理解能对大家有用

管理员回复：不全对，你可以参考下css手册，上边说的很清楚

Guest(113.105.*.*) 发表于：2010-01-15 17:33:00

8错8错8错8错,学习了

学习(119.39.*.*) 发表于：2010-01-13 15:33:19

字体样式 大小 颜色 等一些属性 在#nav h2 a与#nav h2 里设置，有什么区别吗？还用就是你做的这个框很小，我做出来很高，字体行与行直间的距离很大，找了半天也没看到你这里有设计高度的内容，不知道该怎样解决？谢谢站长。

管理员回复：区别在于一个是对于h2内文字设置，一个是对h2内链接文字设置。间距大会不会是h1，h2默认的外边距没有清除呀

Guest(114.246.*.*) 发表于：2009-11-23 12:51:40

font-family:Verdana 是什么意思呀！想问站长一个问题，下面代码中。#nav和#nav h1它们之间是什么关系，为何要这样取名，有何特别的意义！我想让你给我讲讲。先谢谢了！ #nav { width:100px; border-color:#c5c6c4; border-style:solid; border-width:0px 1px 1px 1px;}#nav h1 { margin:0px; padding:4px; font-size:12px; font-weight:

管理员回复：请从本系统教程开始学起，你就明白了

探花(222.216.*.*) 发表于：2009-11-12 17:30:19

精彩，感谢站长，你辛苦了，一定找时间好好学习！

管理员回复：欢迎

xiao fan(222.95.*.*) 发表于：2009-11-05 17:03:56

'因为h1的样式上部都有一条横线，如果nav上部再有一条横线的话成长两条了，结果显示出来就是两像素的高度了。'我都改成这个 border-width:1px 1px 1px 1px;但是就是一个像素的啊，不知道为什么？按理说你的那个说法是对的

管理员回复：border-width:1px;这样写，跟一个值，不用跟四个值；那个需要代码才能看出来

明明(122.4.*.*) 发表于：2009-10-06 10:21:40

很好，很强大，以后做网站就用DIV

管理员回复：顶

不明白(125.119.*.*) 发表于：2009-09-24 19:52:19

如何让所有的文字居中呢,谢谢

管理员回复：请搜索本站相关文章

学习(122.241.*.*) 发表于：2009-09-23 19:40:18

/* 清除常用元素的默认边距 */body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td,ins{ margin: 0px; /* 清除外边距 */ padding: 0px; /* 清除内边距 */老大 以上元素是不是都需要清除啊？

管理员回复：这个根据需要吧，有些时候利用它默认的就挺好的

学习(122.241.*.*) 发表于：2009-09-23 16:31:36

margin英文本意是“ 加边于、 页边的空白”，在CSS中margin是指从自身边框到另一个容器边框之间的距离，就是容器外距离。padding英文本意是“填充”，在CSS中padding是指自身边框到自身内部另一个容器边框之间的距离，就是容器内距离。网上的解释 但是。。。。这里只有1个DIV啊。。。。咋搞。。。margin设置的是什么属性？？

管理员回复：对呀，一个外一个内，margin设置的就是这个div的外边距

学习(122.241.*.*) 发表于：2009-09-23 16:14:51

我去掉H1里面的margin:0px; 怎么影响的是H2里的内框距啊？？奇怪。。

管理员回复：那不是h2的内边距，是h1的外边距

wen(112.94.*.*) 发表于：2009-09-16 15:15:21

做网站做成这样子算不错了，加油！尤其是这个管理员回复功能真的很贴心！

管理员回复：一起加油

wen(112.94.*.*) 发表于：2009-09-16 15:14:09

哇，这个网站太精彩了，真的很感谢你们！辛苦了

管理员回复：不客气

D.PenG(58.210.*.*) 发表于：2009-09-16 09:31:24

padding:4px 是表示上下左右的填充都是4px 吗？还是什么别的意思？这也是一种简写方式是吧？

管理员回复：对，你的理解很正确

o峰(116.226.*.*) 发表于：2009-09-08 16:03:42

楼主,我万分感谢你

管理员回复：不客气

keluo(113.67.*.*) 发表于：2009-08-23 08:45:19

管理员很好、很负责、很男人

管理员回复：^_^

彩虹(59.56.*.*) 发表于：2009-05-18 11:31:18

我是菜鸟,感觉是非常好的教材,我想加入QQ群,可下面的号码好象都是空的,我不知道是什么原因,请告诉我然后才能加入QQ好吗?

管理员回复：你是不是选择成加入好友了，这些都是群号，选择加入群

DIV+CSS(125.41.*.*) 发表于：2009-05-10 15:24:32

在本节中，我想问一个问题，#nav h1和#nav h2 都设置了padding，但为什么离右边边框的内边距不是4px呢？是不是有什么默认规则之类的？请管理员明示，谢谢。

管理员回复：是4px呀。已经设置了padding后就不会受到什么默认规则的影响了。

vivi(61.142.*.*) 发表于：2009-05-06 16:52:40

为什么我弄的h1和nav最上面之间间有一段空白呢？

管理员回复：因为h1默认有外边距，所以需要清除

Guest(125.85.*.*) 发表于：2009-04-11 10:53:15

请教跟问题 为什么我把网站上面的代码复制到自己的电脑上面运行的结果就不一样啊我保存的是html的格式 是不是格式问题啊？

管理员回复：您复制时是否丢掉了某些代码，另外您使用的是什么浏览器？哪个版本？

des(220.174.*.*) 发表于：2008-11-30 13:12:17

#nav h1,h2{float:left;}再把宽度加大就可以实现横向菜单

管理员回复：有专门横向导航菜单的教程

DLvTYsig(125.14.*.*) 发表于：2008-08-05 17:08:36

原来纵向导航菜单可以用div这么轻松做出来呀

管理员回复：欢迎以后常来！！

管理员(124.126.*.*) 发表于：2008-06-24 16:03:49

回复秦商：h1和h2可以实现，但用ul和li的方法也可以。也就是说，实现的方法是多种多样的，对搜索引擎来说，h1和h2的权重要比li的权重高

秦商(222.177.*.*) 发表于：2008-06-24 15:23:00

H1和H2也能实现横向菜单吗?有点累了,没有试.--------网站不支持'<>' 所以重发一遍----------

秦商(222.177.*.*) 发表于：2008-06-24 15:21:09

和 也能实现横向菜单吗?有点累了,没有试.