Google Web字体Bootstrap

Question

我希望下面的body示例中的h1文本使用两种不同的Google Web字体：

<div class="container text-center">
    <h1 class="display-1 mt-5">This Is My Title</h1>
    <p class="lead mb-5">Coming Soon!</p>
</div>

我在头文件中创建了以下内联代码：

<!-- Google Web Fonts -->
<link href="https://fonts.googleapis.com/css?family=Play|Sacramento" rel="stylesheet">

<!-- Inline Style -->
<style>
    .logo-1:{
    font-family: 'Play', sans-serif;
        }
    .logo-2:{
    font-family: 'Sacramento', cursive;
    }
</style>

如何在Play字体中创建"This Is“&在Sacramento字体中创建"My Title”？

Answer 1

由于span是一个内联元素，因此使用span元素可以在不影响布局和定位的情况下添加样式。

<h1 class="display-1 mt-5">
  <span class="logo-1">This Is </span>
  <span class="logo-2">My Title</span>
</h1>