CSS 글꼴 투명도를 설정하는 방법은 무엇입니까?-CSS 튜토리얼-php.cn

CSS 글꼴 투명도를 설정하는 방법은 무엇입니까?

不言

풀어 주다： 2018-10-30 15:27:36

원래의

30063명이 탐색했습니다.

CSS에서 구현할 수 있는 아름다운 스타일은 다양합니다. CSS에서 설정한 스타일은 웹페이지 전체를 매우 아름답게 보이게 해줍니다. 오늘 글에서는 CSS에서 글꼴의 투명도를 설정하는 방법을 소개하겠습니다. 웹 페이지에서 투명합니다.

css3에 새로운 rgba 속성이 추가되었습니다. 소위 rgba 속성은 R(빨간색) G(녹색) B(파란색) + ALPHA(투명도)의 세 가지 색상입니다. 이 rgba 속성 글꼴 투명도를 설정하는 방법.

먼저 RGBA를 사용하여 배경색 투명도를 설정하는 것은 매우 간단합니다. 예를 간단히 살펴보겠습니다. (관련 권장 사항:

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>

로그인 후 복사

배경색 투명도를 설정하는 RGBA의 효과는 다음과 같습니다.

CSS 글꼴 투명도를 설정하는 방법은 무엇입니까?

위 코드는 매우 간단하지 않나요? 그렇다면 글꼴 투명도를 설정하면 RGBA를 어떻게 사용할 수 있을까요?

사실 글꼴의 투명도를 설정하는 방법도 매우 간단합니다. 색상의 rgba 속성을 설정할 수 있습니다.

RGBA에서 글꼴 투명도를 설정하는 구체적인 예를 살펴보겠습니다.

<!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>

로그인 후 복사

글꼴 투명도의 효과는 다음과 같습니다.

CSS 글꼴 투명도를 설정하는 방법은 무엇입니까?