How to set CSS font transparency?-CSS Tutorial-php.cn

How to set CSS font transparency?

不言

Release： 2018-10-30 15:27:36

Original

30018 people have browsed it

There are many beautiful styles that can be implemented in CSS. The styles set by CSS make the entire webpage look very beautiful. Today’s article will introduce to you how to set the transparency of fonts in CSS. Make your fonts appear transparent on web pages.

A new rgba attribute has been added to css3. The so-called rgba attribute is the three primary colors of R (red) G (green) B (blue) plus ALPHA (transparency). Let’s do it next Specifically, take a look at how this rgba attribute sets font transparency.

First of all, it is very simple to use RGBA to set the background color transparency. Let’s take a brief look at an example: (Related recommendations: How to set the background color transparency in css?)

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
.div{
    background-color:rgba(220,38,38,0.2);
    width:100px;
    height:100px;
}
</style>
</head>
<body>
<div class="div">
    我是文字
</div>
</body>
</html>

Copy after login

The effect of setting the background color transparency using RGBA is as follows:

How to set CSS font transparency?

Isn’t the above code very simple? So how can we use RGBA to set the font transparency?

In fact, it is also very simple. To set the transparency of the font, we can set the rgba attribute of color.

Let’s look at a specific example of RGBA setting font transparency:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
.div{
    background:red;
    width:100px;
    height:100px;
    color:rgba(255,255,255,0.4)
}
    </style>
</head>
<body>
<div class="div">
    我是透明文字
</div>
</body>
</html>

Copy after login

The effect of font transparency is as follows:

How to set CSS font transparency?

This article ends here That’s all. Regarding the transparency settings in CSS, you can go to the css video tutorial and css3 video tutorial columns on the PHP Chinese website to learn.

The above is the detailed content of How to set CSS font transparency?. For more information, please follow other related articles on the PHP Chinese website!