LEE.SOL > CSSBattle > Daily Targets (260405)

Daily Targets (260405)

코드

<p><p c><p>
<style>
  body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 50%;
    height: 100%;
    margin: 0;
    background: #D8D8D8;
    /* 우측으로 반사 */
    -webkit-box-reflect: right
  }

  p {
    /* 위, 아래 사각형 */
    width: 40;
    height: 70;
    margin: 0 40;
    background: #457D81
  }

  [c] {
    /* 중간 사각형. 줄무늬 패턴 + 우측 보더로 모양 표현 */
    width: 110;
    height: 100;
    background: linear-gradient(#D8D8D8 30px, #C47F7D 0) 0 0 / 1q 70px;
    border-right: 50px solid #C47F7D
  }
</style>