当前位置:山东群英会技巧>文章>CSS

css中使用rgba和opacity设置透明度的区别(附图)

山东群英会技巧 www.iba5.com.cn 1.使用rgba设置背景色的透明

效果如下:

<body>
    <div id="box">
        你好??!
    </div>
</body>
body {
    background-color:red;
}
#box{
    width:200px;
    height:200px;
    margin:100px auto;
    text-align:center;
    line-height:200px;
    color:white;
    background-color:rgba(182,255,0,.5);
}


2.使用opacity设置背景色的透明

#box{
    width:200px;
    height:200px;
    margin:100px auto;
    text-align:center;
    line-height:200px;
    color:white;
    background-color:rgb(182,255,0);
    opacity:0.5;
}

总结:通过2中效果的比较我们发现opacity会同时影响字体的透明度


相关阅读:

  • 特不靠谱先生言而无信,翻云覆雨小人,王八吃秤砣铁了心要与我朝为敌了。[福尔摩斯] 2019-02-12
  • C罗一人扛起葡萄牙前进 前三届世界杯共打进三球 2019-02-05
  • 习近平在上海合作组织青岛峰会欢迎宴会上的祝酒辞(全文) 2019-02-05
  • 民警扶摔倒大妈反被讹,监控证明清白后遭怼:看见警车吓的! 2019-02-04
  • 法国偶遇赵薇纤细瘦身成功 舒淇背粉包少女心十足 2019-01-23
  • 只有两种可能,你任选一种 2019-01-20
  • 【专题】节能降耗 保卫蓝天——浙江省暨杭州市2018年节能宣传周 2019-01-18
  • 违法和不良信息举报受理和处置管理办法 2019-01-12
  • 国务院关税税则委员会对原产于美国进口商品加征关税公告 2019-01-12
  • 互联网论坛社区服务管理规定 2019-01-02
  • 学习贯彻十九大精神不忘初心 牢记使命 奔向未来 2018-11-29
  • 读出你的爱!市儿童公园父亲节亲子朗诵会等你来 2018-11-13
  • 默滕斯神仙球卢卡库2球 比利时3 2018-11-13
  • 世界杯专版 竞猜型彩票 赔率是公认的竞猜利器 2018-11-10
  • 候选案例:亿滋希望厨房 2018-11-10
  • 251| 459| 849| 37| 674| 381| 312| 943| 745| 551| 767| 159| 376| 434| 654|