加入收藏 | 设为首页 | 会员中心 | 我要投稿 聊城站长网 (https://www.0635zz.com/)- 智能语音交互、行业智能、AI应用、云计算、5G!
当前位置: 首页 > 综合聚焦 > 编程要点 > 语言 > 正文

在CSS中如何让文本的背景半透明,文本不透明

发布时间:2023-10-14 14:54:42 所属栏目:语言 来源:
导读:本文介绍了css实现背景半透明文字不透明的效果示例,分享给大家,具体如下:

效果如下:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>
本文介绍了css实现背景半透明文字不透明的效果示例,分享给大家,具体如下:
 
效果如下:
 
<!DOCTYPE html>
 
<html>
 
    <head>
 
        <meta charset="UTF-8">
 
        <title></title>
 
        <style>
 
            html{
 
                background: #6a8db1;
 
            }
 
            .aside{
 
                background-color:rgba(244,251,251,0.47);
 
                border: 1px   solid  #FFFFFF;
 
                width: 200px;
 
                text-align: center;
 
                color: #FFFFFF;
 
            }
 
            .aside div{
 
                height: 55px;
 
                border-bottom: 1px   solid   #FFFFFF;
 
                line-height: 55px;
            }
 
            .aside  div  font{
 
                font-weight: 800;

            }
 
            .aside  div  span{
 
                font-weight: 800;
 
                margin-left:18px;
 
            }
 
        </style>
 
    </head>
 
    <body>
 
        <div  class="aside">
 
            <div>
 
                <font>留置室1 </font >
 
                <span>10人</span>
 
            </div>
 
            <div>
 
                <font>留置室1 </font >
 
                <span>4人</span>
 
            </div>
 
            <div>
 
                <font>留置室1 </font >
 
                <span>12人</span>
 
            </div>
 
            <div>
 
                <font>留置室1 </font >
 
                <span>6人</span>
 
            </div>
 
            <div>
 
                <font>留置室1 </font >
 
                <span>8人</span>
 
            </div> 

        </div>
 
    </body>
 
</html>
 
 

(编辑:聊城站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章