首页 > 其他 > 详细

文字未知个数居中显示

时间:2019-06-15 18:19:30      阅读:110      评论:0      收藏:0      [点我收藏+]

用样式控制文字居中显示

先看要实现的效果

技术分享图片

代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>Title</title>
    <style>
        .hayu_title{height: 66px;width: 100%;border: 1px solid transparent;border-bottom: 1px solid #a0a0a0;margin: 56px auto;}
        .hayu_title p{height: 40px;font-weight: bold;margin-top: 33px; text-align: center;}
        .hayu_title p span{padding: 0 30px; background: #fff;font-size: 40px;color: #000;}
    </style>
</head>
<body>
<div class="hayu_title">
    <p><span>活动介绍</span></p>
</div>
</body>
</html>

 

文字未知个数居中显示

原文:https://www.cnblogs.com/shanshanjiadexiaohai/p/11028363.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!