<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>

<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<title>田字格布局</title>
<style>
#prat1{
width: 200px;
height: 200px;
background: #CDAD00;
float: left;
}
#prat2{
width: 200px;
height: 200px;
background: #CD6839;
float: left;
}
#prat3{
width: 200px;
height: 200px;
background: #CD6090;
float: left;
clear: left;
}
#prat4{
width: 200px;
height: 200px;
background: #CD3333;
float: left;
}
</style>
</head>
<body>
<div id="prat1">块1</div>
<div id="prat2">块2</div>
<div id="prat3">块3</div>
<div id="prat4">块4</div>
</body>
</html>

 田字格布局html div

 

田字格布局html div

 

田字格布局html div

 

 

 

 

块1
块2
块3
块4

相关文章:

  • 2022-12-23
  • 2021-07-23
  • 2022-01-06
  • 2021-11-27
  • 2021-07-02
  • 2022-01-19
  • 2021-05-25
  • 2021-11-29
猜你喜欢
  • 2021-12-14
  • 2021-08-24
  • 2022-12-23
  • 2021-07-01
  • 2022-01-07
相关资源
相似解决方案