关于居中问题
怎么设置水平居中，我top部分居中有问题
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>作业</title>
<link rel="stylesheet" type="text/css" href="css/1.css">
</head>
<script src="js/1.js" type="text/javascript"></script>
<body>
<!--top区域-->
<div class="tops">
<div class="tops-left">
<a><img src="./img/icon-call.png"></a>011-114/116114电话预约
</div>
<div class="tops-right">
<div class="tops1">欢迎来到城市预约挂号统一平台</div>
<div class="tops2" >请</div>
<a href="#" class="tops3">登录</a>
<a href="#" class="tops4">注册</a>
<a href="#" class="tops5">帮助中心</a>
</div>
</div>
<header>
<div class="header-left">
<img src="./img/logo.png">
</div>
<div class="header-right">
<img src="./img/ui-search.jpg">
</div>
</header>
</body>
</html>
css
*{margin: 0; padding:0;
}
.tops{
background-color: #f5f5f5;
width: 100%;
text-align: center;
height: 30px;
line-height: 30px;
margin:0 auto;
}
.tops-left > img{
height: 22px;
width: 22px;
}
.tops-left {
float: left;
color: #868686;
}
.tops-right >div{
display: inline;
}
.tops-right {
float :right;
}
.tops-right >a {
text-decoration: none;
}
.tops1{
margin-right: 10px;
}
.tops2{
margin-right: 25px;
}
.tops3{
margin-right: 13px;
}
.tops4{
margin-right: 70px;
}
header{
width: 1000px;
height: 93px;
position: relative;
}
.header-left >img{
height: 57px;
width: 399px;
float: left;
cursor: pointer;
}
.header-right >img{
height: 57px;
width: 399px;
float: right;
}
正在回答
同学你好，编程是很灵活的，一种效果有多种实现方式， 看你截图效果是实现了的。
如果还有疑问，可以新建提问，将你写的完整代码粘贴过来，便于帮助同学准确的定位于解决问题。
如果我的回答帮助到了你，欢迎采纳，祝学习愉快~
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星