求助:为何中间的导航条无法居中?_html/css_WEB-ITnose
中间的导航条无论如何都不能居中 ?rz..本人刚开始学html和css,菜鸟一个,望各位高手能指点一二,谢谢!
css代码:
body {
background:#efefef;
text-align:center;
margin:0;
padding:0;
}
#main {
width:950px;
background:#fffacd;
margin:0 auto;
padding:0;
}
#header {
background:#0ff ;
height:180px;
width:950px;
margin:0 auto;
text-align:center;
}
#logo {
background:#044 url(logo.jpg) no-repeat;
width:950px;
height:150px;
margin:0;
padding:0;
}
/********************navbar******************/
#navbar {
margin:0 auto;
padding:0;
background:#ccc;
width:auto;
height:30px;
text-align:center;
}
#navbar ul {
list-style-type:none;
background:#CDB7B5;
width:auto;
margin:0 auto;
padding:0 auto;
height:30px;
clear:both;
}
#navbar ul li {
display:block;
float:left;
width:auto;
text-align:center;
}
#navbar ul li a {
padding:0 5px 0 5px;
height:30px;
float:left;
text-decoration:none;
background:#FFE1FF;
color:black;
line-height:1.5 em;
}
#navbar ul li a:hover {
color:#9C9C9C;
background:#CAE1FF;
}
#navbar .fg {
float:left;
width:1px;
height:30px;
background:black;
}
/********************************************/
#content {
background:#ffffe0;
width:950px;
padding:auto;
margin:auto;
overflow:hidden;
}
#footer {
background:#fff0f5;
width:950px;
height:100px;
padding:0;
margin:auto;
clear:both;
}
/*content内容 left,mid,right */
#left {
margin:0;
float:left;
width:200px;
}
#mid {
background:#0f0;
margin-top:0;
margin-left:4px;
float:left;
padding:0 auto;
width:562px;
height:250px;
}
#right {
background:#00f;
margin:0;
float:right;
width:180px;
padding:auto;
}
HTML:
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
adsfadsf
- ffff
- akgha
- adsga
- daghad
- ahgad
- dagha
- aghhh
- dahg
- adgh
- adgh
- adgh
- adgh
- adgh
- adgh
- adgh
- adgh
- adgh
- adgh
asdfad
回复讨论(解决方案)
你是在哪个浏览器下面看的?
我看了IE6/7/8没跑啊!
在firefox3.6和IE7下都不行啊.
#navbar 在两个浏览器下都是靠左的。
我没看见靠左 可能你的空行太多了 你应用原格式看看!
还是不行啊,楼上的能不能留个QQ教我下?
dtd ? html 前面 ,文?的第一行……
TO 楼上
在Dreamweaver里copy了这么一段,但还是不行..郁闷...
nbsp;html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
charset=gb2312" 改成 charset=utf-8"
检查你的标签是否配对,书写是否正确,例如下面这个嵌套就是错误的。
- 的子元素只能是
-
body里面margin: 0px auto
呃..问题还是没解决..先自己多看看书再来提问,谢谢各位的回答了!
#navbar ul li a {
padding:0 5px 0 5px;
height:30px;/*你这里我给你写的具体值,你可以跟100%*/
float:left;
text-decoration:none;
background:#FFE1FF;
color:black;
line-height:1.5 em;这是你的源代码。在line-height里面;你给单位打了空格无效,出去空格,将值改为1.7em就可以,这样出现;
#navbar ul {
list-style-type:none;
background:;
width:200px;
margin:0 auto;
height:30px;看这个我给你把宽固定了才行,ul是块级元素你给它宽和他的父级元素一样大了。你在夫级里面只是控制到里面的容器,对内容没控制到,除非你重新布局安排ul;好早的帖子,可能对你都没用了;

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

AI Hentai Generator
Générez AI Hentai gratuitement.

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Sujets chauds

Le cache de mise à jour de la page Web du compte officiel, cette chose est simple et simple, et elle est suffisamment compliquée pour en boire un pot. Vous avez travaillé dur pour mettre à jour l'article officiel du compte, mais l'utilisateur a toujours ouvert l'ancienne version. Dans cet article, jetons un coup d'œil aux rebondissements derrière cela et comment résoudre ce problème gracieusement. Après l'avoir lu, vous pouvez facilement faire face à divers problèmes de mise en cache, permettant à vos utilisateurs de toujours ressentir le contenu le plus frais. Parlons d'abord des bases. Pour le dire franchement, afin d'améliorer la vitesse d'accès, le navigateur ou le serveur stocke des ressources statiques (telles que des images, CSS, JS) ou du contenu de la page. La prochaine fois que vous y accédez, vous pouvez le récupérer directement à partir du cache sans avoir à le télécharger à nouveau, et il est naturellement rapide. Mais cette chose est aussi une épée à double tranchant. La nouvelle version est en ligne,

L'article discute de l'utilisation des attributs de validation de formulaire HTML5 comme les limites requises, motifs, min, max et longueurs pour valider la saisie de l'utilisateur directement dans le navigateur.

L'article examine les meilleures pratiques pour assurer la compatibilité des navigateurs de HTML5, en se concentrant sur la détection des fonctionnalités, l'amélioration progressive et les méthodes de test.

Cet article démontre un ajout de bordure PNG efficace aux pages Web à l'aide de CSS. Il soutient que CSS offre des performances supérieures par rapport à JavaScript ou à des bibliothèques, détaillant comment ajuster la largeur, le style et la couleur des bordures pour un effet subtil ou proéminent

L'article traite du HTML & lt; Datalist & GT; élément, qui améliore les formulaires en fournissant des suggestions de saisie semi-automatique, en améliorant l'expérience utilisateur et en réduisant les erreurs. COMMANDE COMPRES: 159

L'article traite du HTML & lt; Progress & GT; élément, son but, son style et ses différences par rapport au & lt; mètre & gt; élément. L'objectif principal est de l'utiliser & lt; Progress & gt; pour l'achèvement des tâches et & lt; mètre & gt; pour stati

Cet article explique le html5 & lt; time & gt; élément de représentation sémantique de date / heure. Il souligne l'importance de l'attribut DateTime pour la lisibilité à la machine (format ISO 8601) à côté du texte lisible par l'homme, stimulant AccessIbilit

L'article traite du HTML & lt; mètre & gt; élément, utilisé pour afficher des valeurs scalaires ou fractionnaires dans une plage, et ses applications courantes dans le développement Web. Il différencie & lt; mètre & gt; De & lt; Progress & gt; et ex
