CSSBattle

Daily Targets (260319)

코드
<p><p>
<style>
  &>* {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #A6D6AE
  }
  
  p {
    width: 100;
    height: 100;
    /* 중앙 선 */
    background: linear-gradient(#3F4869) 50% / 100% 30px no-repeat;
    /* 사각형 테두리, 상하좌우 일부 잘라냄 */
    border: 30px solid #3F4869;
    clip-path: polygon(0 30px, 30px 30px, 30px 0%, 130px 0%, 130px 30px, 100% 30px, 100% 130px, 130px 130px, 130px 100%, 30px 100%, 30px 130px, 0% 130px)
  }
  
  p+p {
    margin-left: -30
  }
</style>