CSSBattle

Daily Targets (260114)

코드
<p w>
  <i>
    <b c></b>
    <b r></b>
  </i>
</p>
<style>
  &>*{
    background:#A82973
  }
  *{
    margin: 0;
    box-sizing: border-box
  }
  [w] {
    /* 우측으로 반사 */
    -webkit-box-reflect: right;
    width: 50%;
    height: 100%
  }
  i {
    display: block;
    padding: 30px 20px;
    /* 아래로 반사 */
    -webkit-box-reflect: below;
    width: 100%;
    height: 50%
  }
  b {
    display: block
  }
  [c] {
    /* 원 요소 */
    width: 50;
    height: 50;
    border-radius: 50%;
    margin-left:40;
    background: #FFD0FA
  }
  [r] {
    margin: 10;
    width: 110;
    height: 120;
    /* 직사각형 패턴 */
    background: linear-gradient(90deg, #FFD0FA 50px, #A82973 0) 0 / 60px #FFD0FA
  }
</style>