HTML中怎么使文字各种居中对齐？（代码示例）-木庄网络博客

2022-02-21 18:45:39 PHP中文网 JavaScript 百度已收录

本文摘自PHP中文网，作者藏色散人，侵删。

本篇文章主要介绍了如何去写关于html文字居中代码。希望对有需要的朋友有所帮助。

html文字居中代码具体示例如下：

<!DOCTYPE HTML>
<html lang="en">
<head>
    <title>html文字居中测试</title>
    <meta charset="UTF-8">
    <style type="text/css">
        body{background: #ddd;}
        div{width:300px;height:180px;margin:10px auto;color:#fff;font-size:24px;}
        .box1{background: #71a879;text-align: center;}
        .box2{background: #6a8bbc;line-height: 200px;}
        .box3{background: #dea46b;text-align: center;line-height: 200px;}
    </style>
</head>
<body>
<div  class="box1">html文字水平居中</div>
<div  class="box2">html文字垂直居中</div>
<div  class="box3">html文字水平上下居中</div>
</body>
</html>