zoukankan      html  css  js  c++  java
  • CSS卡券效果制作

    <p class="coupon">
     <span>10000</span>SWT优惠券
    </p>
    .coupon {
      width: 300px;
      height: 100px;
      line-height: 100px;
      margin: 50px auto;
      text-align: center;
      position: relative;
      background: radial-gradient(circle at right bottom, transparent 10px, #00BFFF 0) top right /50% 51px no-repeat,
      radial-gradient(circle at left bottom, transparent 10px, #00BFFF 0) top left / 50% 51px no-repeat,
      radial-gradient(circle at right top, transparent 10px, #00BFFF 0) bottom right / 50% 51px no-repeat,
      radial-gradient(circle at left top, transparent 10px, #00BFFF 0) bottom left / 50% 51px no-repeat;
      filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .2));
    }
    .coupon span {
      display: inline-block;
      vertical-align: middle;
      margin-right: 10px;
      color: red;
      font-size: 50px;
      font-weight: 400;
    }

    10000SWT优惠券

  • 相关阅读:
    JDBC
    SQL语法(3)
    数据库设计和三大范式
    SQL语法(2)
    SQL语法(1)
    数据库的概念以及MYSQL的安装和卸载
    IO流(下)
    IO流(上)
    bash: javac: command not found...
    R语言绘制地图
  • 原文地址:https://www.cnblogs.com/swt-axios/p/14859326.html
Copyright © 2011-2022 走看看