Home > Article > Web Front-end > How to use span css to set the font color inside a div?

How to use span css to set the font color inside a div?

云罗郡主forward: 2018-11-22 15:10:4912361browse

The content of this article is about how to use span css to set the font color inside a div. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Use the span tag to set the font color of part of the text in a div.

A piece of text is placed in a DIV or P. When we set the font color of the div or p, the font color of all the text inside will become the font color we set. Usually, several words or part of the words in a paragraph of text are laid out with different font colors. At this time, you can cleverly use the span tag to set the class or id or directly set the CSS to set the required font color.

1. CSS color style words: color

2. Example tutorial instructions

Here, set different colors for some of the text in p and DIV text content.

3. Example code

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>span对一段文字其中部分文字设置不同颜色</title>
<style>
div{ color:#000}
p{ color:#F00}
.red{ color:#F00}
#blue{ color:#06F}
</style>
</head>
<body>
<div>欢迎来到php中文网学习html技术，<span class="red">这里有全面的css教程</span></div>
<p>此案例是对一段文字中，其中部分文字<span id="blue">设置不同的颜色</span>。运用SPAN标签来实现。</p>
<p>直接对文字使用span后直接写CSS<span style="color:#6C0">实现不同字体颜色</span></p>
</body>
</html>

The effect is as follows:

How to use span css to set the font color inside a div?

##The span tag is used here to set different font colors for part of the text in a paragraph. , you can also extend and apply em, b, strong and other tags flexibly.

The above is a complete introduction to how to use span css to set the font color inside a div. If you want to know more about

CSS3 tutorial, please pay attention to the PHP Chinese website.

The above is the detailed content of How to use span css to set the font color inside a div?. For more information, please follow other related articles on the PHP Chinese website!

php css css3 class

Statement：

This article is reproduced at:thinkcss.com. If there is any infringement, please contact admin@php.cn delete

Previous article：What does list-style mean? Detailed explanation of list-style style attributesNext article：What does list-style mean? Detailed explanation of list-style style attributes

See more

How to use span css to set the font color inside a div?

Related articles