html - Bootstrap 在一行中为多个单词着色?

标签 html css twitter-bootstrap twitter-bootstrap-3 colors

我目前正在学习 bootstrap(顺便说一句,它太棒了!)我有一个问题。我有一个像这样的“h3”标签...

 <h3 class="pull-right">CALL 555-123-4567</h3>

我想为这个标签设计样式是将“调用”部分设为一种颜色,将电话号码设为另一种颜色。

我知道如何用 css 做到这一点,但是 bootstrap 与此有什么关系吗?我是否需要为与电话号码分开的“调用”一词创建另一个类?

例如。 . .

 <h3 class="pull-right"><h3 class="#">CALL</h3><h3 class="#">555-123-456</h3>

或者它会更像这样的 ID 吗?

 <div id="container"> <!--pull this right with bootstrap? would that even work? would the name need to be 'pull-right' and not container?-->
    <h3 class="colorChange"> CALL <h3> <h3 class="newColorChange" 555-123-4567</h3>
 </div>

哪个更合适?使用 Bootstrap 框架更改文本颜色的原始问题是我主要关心的问题。

最佳答案

永远不要将 h3 嵌套在 h3 标签中。要分别设置 CALLphone no. 的样式,您只需要这样做:

    <h3 class="pull-right">
     <span class="call">CALL</span>
     <span class="number">555-123-4567</span>
   </h3>

现在可以分别设置CALLNumber 的样式。

关于html - Bootstrap 在一行中为多个单词着色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39864743/

相关文章:

html - 如何不包装div的内容?

php - 将mysql查询的输出依次插入到html表中

HTML 页脚位置 - body 必须是父元素吗?

twitter-bootstrap - 在 Twitter Bootstrap 2.3.2 中使用 input-block-level 和 input-prepend

twitter-bootstrap - 在 Play 2.x 中覆盖 WebJar Assets

html - 如何隐藏 Bootstrap 导航栏默认图标

html - 删除 Bootstrap 表单输入之间的边距

css - :hover black outline around words

css - 使用 nuxt js 从插件文件中所需的节点模块导入 css

javascript - 从第一个按钮下拉后移动下一个按钮