想问下老师如何把表单设置在图片中间居中？

首页课程实战体系课手记专栏慕课教程

想问下老师如何把表单设置在图片中间居中？

来源：4-3 项目作业

霸气的少年

2019-12-28 23:51:46

<div class="content">
		<div class="banner">
			<img src="images/banner3.jpg" class="banner-img">
		</div>
		<div>
		<form class="banner-form">
				<input type="text" name="" placeholder="your Name" id="lie"><br>
				<input type="text" name="" placeholder="your phone" id="lie"><br>
				<input type="text" name="" placeholder="your Email" id="lie"><br>
				<textarea cols="30" rows="5" id="lie1" placeholder="Write Your Comment Here"></textarea><br>
				<input type="submit" name="" placeholder="SEND MESSAGE" id="lie2"><br>
			</form>
		</div>
	</div>

写回答

1回答

好帮手慕小班

好帮手慕小班

2019-12-29

同学你好，这里同学想实现banner区的表单内容居中展示吗，同学可以给文本框的父div或者form添加定位，只需设置它的top和right即可。

设置左右居中，定位right为50%后，div的左边框距浏览器右边有了全屏幕50%的宽度，所以还需要“拽回来”自身宽度的一半才能让它的中心线是居中的。比如说：需要设置宽度width:500px;然后设置margin-right: -250px;

如上所示，就是实现水平居中的效果。

如果我的回答解决了你的疑惑，请采纳！祝学习愉快！

0

0 学习 · 9666 问题

相似问题

关于图片上的表单的问题

回答 2

为什么无法设置居中

回答 3

老师解答下，怎么样可以把当前图片logo设置在页眉的的中间

回答 1

怎么让form表单在图片上居中显示呢

回答 1

banner区表单如何居中啊，表单的长度如何设置成一样，

回答 1

打开慕课网App查看更多内容