衔叶为笙 2023-02-12 15:46 采纳率: 100%
浏览 29
已结题

::after 效果不显示

img

 shishen changef
     position:relatives
     height:80px
     width:80px
     margin:4px
     margin-bottom:                     20px
     padding:5px
     opacity:0.2;
 shishen change::afterf
     content:’’;
     background-image:url(../images/ban.png)
     position:absolute
     left:0
     top:0
     width:80px
     height:80px
 shishenchange是图片的样式,后面写伪类Q定位一张图片,图片ban.png如下:

img

  • 写回答

3条回答 默认 最新

  • 辉煌仪奇 2023-02-12 16:15
    关注

    你好,看你的图片你是展示出了图片的效果的,不透明度0.2可以设置更小获得图片显示的最佳效果
    按照你的思路我写了个demo,是可以实现你后面截图的效果的,

    img


    下面是参考代码,如有帮助,请点一下采纳,谢谢

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            .shishen {
                width: 300px;
                height: 300px;
                margin: 4px;
                margin-bottom: 20px;
                padding: 5px;
                opacity: 0.2;
                position: relative;
            }
            .shishen::after{
                content: '';
                background-image: url("./image/Picture11.jpg") ;
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }
    
        </style>
    </head>
    <body>
    <div class="shishen">
    
    </div>
    </body>
    </html>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

问题事件

  • 系统已结题 2月20日
  • 已采纳回答 2月12日
  • 创建了问题 2月12日

悬赏问题

  • ¥15 高价求中通快递查询接口
  • ¥15 解决一个加好友限制问题 或者有好的方案
  • ¥15 关于#java#的问题,请各位专家解答!
  • ¥15 急matlab编程仿真二阶震荡系统
  • ¥20 TEC-9的数据通路实验
  • ¥15 ue5 .3之前好好的现在只要是激活关卡就会崩溃
  • ¥50 MATLAB实现圆柱体容器内球形颗粒堆积
  • ¥15 python如何将动态的多个子列表,拼接后进行集合的交集
  • ¥20 vitis-ai量化基于pytorch框架下的yolov5模型
  • ¥15 如何实现H5在QQ平台上的二次分享卡片效果?