Question

我想在页面中间添加一个中心文字标题，它不会显示出来。代码似乎是正确的，没有看到错误。

getIntPropertyValue()

Answer 1

试试这个

coordinates {lat,long}

  #welcome_text_div {
    position: absolute;
    background-color:red;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    }
    
    #welcome_text {
    color: white;
    font-family: sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 55px;
    text-align: center;
    width: 800px;
    line-height: 300px;
    }

    <div id="welcome_text_div">
      <p id="welcome_text"> Welcome </p>
    </div>

Answer 2

您可以使用flexbox实现此目的。

你需要对容器做的只是定义它的宽度和高度（并给它一个bg颜色）：

const

然后添加这三行以设置弹性框显示上下文，并将其垂直和水平居中：

#welcome_text_div {
    background-color:red;
    width:800px;
    height:300px;
}

然后从内部div中删除所有额外的格式。

display:flex;
align-items:center;
justify-content:center;

https://jsfiddle.net/k5zve6bf/

Answer 3

你只需要使用text-align：center，它应该自动居中。顺便说一下，我发现你经常使用ID，这是非常糟糕的做法。对于css，class应该用于javasscript选择器。

.center-text {
  text-align:center;
}

.title-text {
  // Do css formating here  
}

 <div class="center-text title-text">
  <p class="page-title"> Welcome </p>
</div>

尝试在页面中添加中心标题

3 个答案: