【问题标题】:How can i center vertically this background with the text inside?我怎样才能垂直居中这个背景与里面的文字?
【发布时间】:2021-05-15 19:58:38
【问题描述】:

我正在尝试将这些文本的背景颜色垂直居中。 I see this way only on mobile devices: 我在我的电脑上正常看到它。我也在使用@font-face gotham font-family。有谁知道如何解决这个问题?

这是代码:https://jsfiddle.net/demiancurutchet/54mw8gs2/11/

CSS:

.title {
color: #D4145A;
line-height: 1.5;
color: #333;
text-transform: uppercase;
font-size: 2rem;
width: 100%;}
.title span {
width: fit-content;
display: inline-block;
padding: 5px 10px;
align-items: center;}
.bg-violet {
background-color: #662D91;
color:#fff;}

HTML:

<h1 class="title">
    Tu empresa va a <br>
    <span class="bg-violet">incrementar</span> sus <span class="bg-violet">ingresos</span>
</h1>

非常感谢!!

【问题讨论】:

    标签: css text center vertical-alignment


    【解决方案1】:

    如果你想这样试试这个......

    .title {
    color: #D4145A;
    line-height: 1.5;
    color: #333;
    text-transform: uppercase;
    font-size: 2rem;
    text-align:center;
    width: 100%;}
    .title span {
    width: fit-content;
    display: inline-block;
    padding: 5px 10px;
    }
    .bg-violet {
    background-color: #662D91;
    color:#fff;}
    <h1 class="title">
        Tu empresa va a <br>
        <span class="bg-violet">incrementar</span> sus <span class="bg-violet">ingresos</span>
    </h1>

    【讨论】:

      猜你喜欢
      • 2017-09-02
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-12-30
      • 2018-11-24
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多