banner区表单如何居中啊，表单的长度如何设置成一样 ，
来源：4-3 项目作业
兮兮666
2019-08-05 19:28:56
<!DOCTYPE html>
<html>
<head>
<title>商城</title>
<link rel="stylesheet" type="text/css" href="css/common.css">
<script type="text/javascript" src="js/js1.js"></script>
</head>
<body>
<div class="top">
<div class="top-logo">
<a href="#"><img src="image/logo.png"></a>
</div>
<div class="top-navigation">
<ul>
<li class="bian">
<div class="one">
<a href="#">HOME</a>
</div>
</li>
<li class="bian"><a href="#">ABOUT</a></li>
<li class="bian"><a href="#">GALLERY</a></li>
<li class="bian"><a href="#">FACULTY</a></li>
<li class="bian"><a href="#">EVENTS</a></li>
<li class="bian"><a href="#">CONCACT</a></li>
</ul>
</div>
</div>
<div class="banner">
<div class="banner-imgform">
<img src="image/banner3.jpg" class="banner-img">
<div class="banner-form">
<form>
<input type="text" name="" value="your Name"><br>
<input type="text" name="" value="your phone"><br>
<input type="text" name="" value="your Email"><br>
<textarea cols="30" rows="5">Write Your Comment Here</textarea><br>
<input type="submit" name="" value="SEND MESSAGE"><br>
</form>
</div>
</div>
</div>
</body>
</html>
/*全局设置*/
*{
margin: 0;
padding: 0;
}
/*全局字体设置*/
body{
font-family: Microsoft YaHei UI;
}
/*顶部*/
.top{
width: 100%;
height: 68px;
background-color: #07cbc9;
line-height: 68px;
}
/*logo设置*/
.top .top-logo{
float: left;
margin-left: 180px;
margin-top: 7px;
}
/*导航栏设置*/
.top .top-navigation ul li{
float: right;
list-style: none;
margin-right: 20px;
}
/*导航栏设置离右边距离*/
.top .top-navigation ul{
margin-right: 40px;
}
/*导航栏设置去下划线*/
.top .top-navigation ul a{
text-decoration:none;
color: white;
}
/*伪类设置鼠标移动到导航栏背景变色*/
.top .top-navigation ul a:hover{
background-color: #000;
display: block;
}
/*banner区*/
/*背景图片设置项*/
.banner{
}
/*背景图片*/
.banner .banner-img{
width: 100%;
height: 400px;
margin-top: -15px;
float: left;
}
.banner .banner-imgform{
}
.banner .banner-form{
position: absolute;
margin: 100px 100px 100px 100px;
}
1回答
-
好帮手慕柯南
2019-08-06
同学你好！
1.表单居中可以参考一下思路：给保单设置left：50%，margin-left为父表单长度的一半，可参考一下代码：
2.表单的长度设置为一样，给所有的input框设置相同的长度即可：
如果我的回答解决了你的疑惑，请采纳，祝学习愉快~
0
相似问题