为什么我右侧的那一栏超链接上不去

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>网页布局</title>
	<link rel="stylesheet" href="css/index.css">
</head>
<body>
	<div class='Top'>
		<div class='logo' >
			<img src="images/logo.png" alt="">
		</div>

		<div class='title-btn' >
			<ul>
				<li><a href="#">HOME</a></li>
				<li><a href="#">ABOUT</a></li>
				<li><a href="#">GALLERY</a></li>
				<li><a href="#">FACLTY</a></li>
				<li><a href="#">EVENTS</a></li>
				<li><a href="#">CONTACT</a></li>
			</ul>
		</div>
	</div>
</body>
</html>

/*去除和浏览器的默认边距*/
*{
	padding:0px;
	margin: 0px;
}

/*设置顶部div样式*/
.Top{
	background-color: #07cbc9;
	height: 80px;
}

/*设置顶部logo样式*/
.Top .logo{
	margin-left: 80px;
	line-height: 80px;
	height: 80px;
	width: 280px;

}

/*去除超链下划线*/
a{
	text-decoration: none;
}



/*设置顶部右侧标签样式*/
.Top .title-btn{
	float: right;
	height: 80px;
}
.Top ul {
	list-style: none;
	line-height: 80px;
	height: 80px;
}
.Top ul li{
	float: left;

}

反冲斗士 2021-03-17

源自：前端油画商城案例 4-3 项目作业

收起

1回答

好帮手慕美 2021-03-17 17:38:53

同学，你好！logo所在div需要设置浮动，浮动后会脱离文档流，右侧导航栏就上去了

祝学习愉快！

收起回答

提问者反冲斗士 #1

我之前也有考虑过这个问题，因为老师说过div是占一整行的
但是我想的是不是我把div的宽度改小，它就不占一整行呢

2021-03-17 20:47:01
好帮手慕美回复提问者反冲斗士 #2

同学，你好！div是块级元素，即使设置了宽度大小也会独占一行显示的。祝学习愉快！

2021-03-18 10:02:30
提问者反冲斗士回复好帮手慕美 #3

那logo块级元素往左浮动，右边的标签往右边浮动
是浮动就不会占一行了吗

2021-03-18 13:51:34