下面是一个示例代码，其中使用 CSS 样式设置字体和行距，以及一个按钮来创建两行文本。
标题 1：使用 CSS 字体两行
使用 CSS 字体两行的方法非常简单。只需在 HTML 中添加两个 `<div>` 元素，一个用于文本，另一个用于背景。然后，使用 CSS 样式设置字体和行距，就可以让文本两行分开，并且在不同的颜色之间切换。
下面是一个简单的示例代码：
“`html
<div class=”text-container”>
<div class=”text”>第一行文本</div>
<button>创建两行文本</button>
</div>
“`css
.text-container {
position: relative;
width: 300px;
height: 200px;
.text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 16px;
font-weight: bold;
color: #fff;
button {
background-color: #007bff;
color: #fff;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
button:hover {
background-color: #0069d9;
在这个示例中，使用 CSS 样式设置 `.text-container` 元素的样式。它使用 `position: relative` 属性定位元素，并使用 `width: 300px;` 和 `height: 200px;` 设置其宽度和高度。然后，使用 `.text` 元素的 `position: absolute` 属性和 `top: 50%; left: 50%;` 属性设置其相对位置和偏移量。使用 `font-size: 16px;` 和 `font-weight: bold;` 设置字体大小和颜色。
接下来，使用 CSS 样式设置按钮的样式。使用 `background-color` 属性设置按钮的背景颜色，使用 `color` 属性设置按钮的文本颜色，使用 `padding` 和 `border` 属性设置按钮的边距和边框。使用 `border-radius` 属性设置按钮的圆角。使用 `cursor: pointer;` 属性设置按钮为可见状态。
最后，使用 CSS 样式设置按钮的hover状态，使按钮在鼠标悬停时呈现不同的样式。
通过使用这种方法，可以轻松创建两行文本，并设置字体和行距的大小和位置，使得文本更容易阅读。