页面如图所示 。我的问题出在包含按钮及图标的部分，我用绝对定位，但是位置老不对，这部分样式改怎么设置？<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>主页</title>
<link rel="stylesheet" href="CSS/home-style.css">
</head>
<body>
<div class="left">
<div calss="box">
<input type="button" value="按钮" class="btn"/>
</div>
</div>
<div class="middle">
</div>
<div class="right">
</div>
</body>
</html>*{
margin: 0;
padding: 0;
}
.left{
float: left;
width: 33%;
height: 643px;
background-color: #50abff;
position: relative;
}
.middle{
float: left;
width: 34%;
height: 643px;
background-color: #ffef25;
}
.right{
float: right;
width: 33%;
height: 643px;
background-color: #ff5261;
}
.box{
width:100%
position:absolute;
top:400px;
background-color: #b4d1d7;
}
.btn{
background-color: #b4d1d7;
border: 1px white solid;
}
1 回答
已采纳
损失函数
TA贡献114条经验 获得超93个赞
写代码最重要的是仔细些。首先class为box的div的“class”写成了“calss”，其次在css中的box的width后没有加分号“;”。
你要的效果代码，我贴下面了。
望采纳！
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>主页</title>
<style>
*{
margin: 0;
padding: 0;
}
.left{
float: left;
width: 33%;
height: 643px;
background-color: #50abff;
position: relative;
}
.middle{
float: left;
width: 34%;
height: 643px;
background-color: #ffef25;
}
.right{
float: right;
width: 33%;
height: 643px;
background-color: #ff5261;
}
.box{
width:100%;
height: 243px;
position:absolute;
top:400px;
background-color: #b4d1d7;
}
.btn{
position:relative;
top: 70%;
left:50%;
background-color: #b4d1d7;
border: 1px white solid;
}
</style>
</head>
<body>
<div>
<div>
<input type="button" value="按钮"/>
</div>
</div>
<div>
</div>
<div>
</div>
</body>
</html>
- 1 回答
- 2 关注
- 1131 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消