<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
.div1{
width:50%;
height:100px;
background-color:#0C0;
display:inline-block;
}
.div2{
width:50%;
height:100px;
background-color:#aaa;
display:inline-block;
}
</style>
</head>
<body>
<div class="div1">
left
</div><div class="div2">
right
</div>
</body>
</html>
效果:
总结:上面是通过display:inline来解决的,另外还可使用float来解决;
如果想要div中的内容居中,可使用padding来实现
参考:https://blog.csdn.net/aitangyong/article/details/42775803