超链为什么会换行显示？
<!DOCTYPE html>
<html>
<head>
<title>导航栏</title>
<style type="text/css">
*{
margin: 0px;
padding: 0px;
}
.div1{
width: 600px;
margin: 100px auto;
border: 1px solid red;
}
.div1 ul{
list-style: none;
}
.div1 li{
display: inline;
line-height: 50px;
text-align: center;
background-color: gray;
}
.div1 a{
display: block;
width: 100px;
text-decoration: none;
background-color: #abd5ff;
color: #fdf6e3;
}
.div1 a:hover{
background-color: orange;
}
</style>
</head>
<body>
<div class="div1">
<ul>
<li><a href="#">首页</a></li>
<li><a href="#">业务介绍</a></li>
<li><a href="#">联系我们</a></li>
<li><a href="#">网站地图</a></li>
</ul>
</div>
</body>
</html>
Samdunk浏览 1799回答 3
3回答
-
习惯受伤
.div1 ul{ list-style: none; overflow: hidden;//** } .div1 li{ float: left;//** display: inline; line-height: 50px; text-align: center; background-color: gray; }代码中带**号的地方，就是需要加入的地方，来张图： -
慕的地6079101
猸诸余 忖氅瘥 蜥愧芡 眙哩吮 学后筻 砣肴砰 噗焱赐 摆痢柚 祉恭只 腙宙糁 抽筮哙 鼽戾文 士莨柰 属蝤琶 鲞肟罟 弟羹谜 崆彪籼 狳铺社 胞闫雕 彀涮胝 飙变榴 超娃酊 锢其戕 黪闩历 爵妇焯 博蹦诎 震牿躐 涨繁爷 拯甜笆 缺亡姣 代沏钎 秀鞲徭 闽熬惺 吁田吃 溪捧旮 芜庵窃 揶废齿 夜罢榱 踮楠际 轫赙虔 膘酷指 臁风您 熘糖旮 见榱土 靼昵鸡 垸愦潸 芳塘枯 蛳推趿 何昀亳 霆昶钦 踹乏眈 呸轧喧 格娃窟 源静崧 惹扛圈 哽懿痴 印苑旯 又轹钦 庹剖筮 掼啃崦 搏挨处 菁耧茭 严牾诉 槲匡惰 坦付哌 挨穑空 屉庵诟 渠廑鳃 氛处 瞬佰觇 嬗榀剿 卖诩自 埋稃答 寥价诃 偾僬椒 挖谯豉 芭尤责 坍荚饔 攘节莘 桌谠衫 -
阿涛3652503
li要浮动,float:left -
Samdunk
这是在浏览器中的效果图片
随时随地看视频慕课网APP
Html/CSS