css给文字加背景框

标题：CSS 给文字加背景框

CSS 是一种用于设计和布局网页的样式表语言。通过使用 CSS，我们可以对网页中的文本、图形、颜色、边框、背景等进行样式化，使得网页更加美观和易于阅读。本文将介绍如何使用 CSS 给文字加背景框。

1. 创建 HTML 文件，并添加一个包含文本的 HTML 标签。例如：

div class="background-box">

p> 这是一个背景框中的文本。/p>

/div>

2. 定义 CSS 样式，为背景框添加一个类名。例如：

.background-box {

width: 200px;

height: 200px;

background-color: #fff;

border-radius: 5px;

padding: 10px;

3. 定义文本的样式，使用 p 标签，并为文本添加一个类名。例如：

.background-box p {

font-size: 16px;

font-weight: bold;

line-height: 1.5;

4. 将 HTML 文件和 CSS 样式文件保存为 .css 文件，并将其放置在网页的合适位置。例如：

head>

link rel="stylesheet" type="text/css" href="background-box.css">

/head>

完整代码示例：

div class="background-box">

p> 这是一个背景框中的文本。/p>

/div>

CSS 样式表：

.background-box {

width: 200px;

height: 200px;

background-color: #fff;

border-radius: 5px;

padding: 10px;

.background-box p {

font-size: 16px;

font-weight: bold;

line-height: 1.5;

当浏览器打开这个网页时，我们可以看到一个背景框中包含了一个文本。通过使用 CSS，我们可以轻松地给文字加背景框，使得网页更加美观和易于阅读。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！