美文网首页
file选择图片组件(CSS加号样式)

file选择图片组件(CSS加号样式)

作者: 努力study代码的小哪吒 | 来源:发表于2022-02-18 11:04 被阅读0次

    Css加号样式

    <div class="camera_icon" :style="{background: bgColor, '--color': addColor }" >
         <--这个看自己的需求需要不需要-->
        <p class="title" v-if="titleShow">首图</p>  
    </div>
      .camera_icon
        width 100%
        height 100%
        border-radius 16px
        position relative
        display flex
        justify-content center
        .title
          padding-top 35%
          font-size 28px
          font-family PingFangSC-Medium, PingFang SC
          font-weight 500
        &:before
          content ''
          position absolute
          left 50%
          top 50%
          width 68px
          height 8px
          border-radius 20%
          background var(--color)
          margin-left -34px
          margin-top -4px
        &:after
          content ''
          position absolute
          left 50%
          top 50%
          width 8px
          height 68px
          border-radius 20%
          background var(--color)
          margin-top -34px
          margin-left -4px
    

    效果展示

    截屏2022-02-18 上午11.04.03.png

    相关文章

      网友评论

          本文标题:file选择图片组件(CSS加号样式)

          本文链接:https://www.haomeiwen.com/subject/ijzelrtx.html