Question

我需要将文本带到标题的中心，并且还必须为Bootstrap中的文本添加颜色。 Bootstrap中没有Font-color或text-color选项。

这是我的HTML和CSS代码

＆＃13;

#header {
  width: 800px;
  height: 50px;
  color :white;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<div id="header" class="span12" style ="background-color :#003366; width :800px; height:50px; font-weight:bold; font-style :normal ;font-size:35px;">Customer</div>

＆＃13;

这就是它现在的样子：

Answer 1

使用color（例如：color:#bbddff;）更改文字的颜色，text-align:center指定要在div中心的文字。像这样：

＆＃13;

#header {
  width: 800px;
  height: 50px;
  color :#bbddff;
  text-align:center;
}

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<div id="header" class="span12" style ="background-color :#003366; width :800px; height:50px; font-weight:bold; font-style :normal ;font-size:35px;">Customer</div>

＆＃13;

如果此代码无效，您可能会遇到与这些代码冲突的其他样式。我的建议：

在浏览器上打开您的页面。
打开开发人员工具。
检查#header元素。
查看从哪里获取样式。

可能你的风格被其他地方覆盖了。

Answer 2

<span class="test-span">This is span.</span>

.test-span{
 display:block;
 text-align:center;
 color:red;
}

Span is not a block element so to make text center in it, first need to make it block element and you can make that with above code.

要为任何文字着色，请使用CSS属性＆＃39; color＆＃39;并给出你的选择价值（例如：颜色：蓝色;）。

Answer 3

只需添加text-align: center 和 color: #FFFFFF 因为它是#header css

的白色

Answer 4

你可以使用class =“text-center”这是一个例子。

    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
          <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <body>

    <div class="container">
       <p class="text-center">Center aligned text.</p>
    </div>
</body>

如何将文本置于标题的中心并为Bootstrap中的文本赋予颜色？

4 个答案: