本文小编为大家详细介绍“css设置div居中的方法是什么”，内容详细，步骤清晰，细节处理妥当，希望这篇“css设置div居中的方法是什么”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。
具体操作步骤：
1.首先创建一个html文件。
2.将html架构代码添加到html文件中。
<!DOCTYPE html>
<html>
<head>
<title>div居中</title>
</head>
<body>
</body>
</html>
3.在html架构中的body标签里面使用div标签设置一个div盒子。
<div>定宽块状元素水平居中</div>
4.在html架构中的html标签里面添加style标签并设置css居中样式。
<style>
div{
border:1px solid red;
width: 200px; /*定宽*/
margin:20px auto; /*margin-left 与 margin-right 设置为 auto*/
}
</style>5.最后可通过浏览器方式阅读html文件查看设置效果。
完整示例代码：
<!DOCTYPE html>
<html>
<head>
<title>div居中</title>
</head>
<style>
div{
border:1px solid red;
width: 200px; /*定宽*/
margin:20px auto; /*margin-left 与 margin-right 设置为 auto*/
}
</style>
<body>
<div>定宽块状元素水平居中</div>
</body>
</html>读到这里，这篇“css设置div居中的方法是什么”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注天达云行业资讯频道。