1、div css布局之div左对齐,DIV+CSS布局完整代码:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>div对齐实例 在线演示 DIVCSS5</title> 
<style> 
.divcss5-left{float:left;width:250px;height:50px;border:1px solid #F00} 
</style> 
</head> 
<body> 
<div class="divcss5-left">此DIV靠左对齐显示</div> 
</body> 
</html>
2、div css布局之div右对齐,DIV+CSS布局完整代码:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>div对齐实例 在线演示 DIVCSS5</title> 
<style> 
.divcss5-right{float:left;width:250px;height:50px;border:1px solid #F00} 
</style> 
</head> 
<body> 
<div class="divcss5-right">此DIV靠右对齐显示</div> 
</body> 
</html>
3、div css布局之div居中对齐,DIV+CSS布局完整代码:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>div对齐实例 在线演示 DIVCSS5</title> 
<style> 
.divcss5-cent{margin:0 auto;width:250px;height:50px;border:1px solid #F00} 
</style> 
</head> 
<body> 
<div class="divcss5-cent">此DIV居中右对齐显示</div> 
</body> 
</html>