css로 다각형 모양을 잡고 border로 다각형 모양에 맞춰 테두리를 두르려 하는데 도와주세요ㅠ

css로 다각형 모양을 잡고 border로 다각형 모양에 맞춰 테두리를 두르려 하는데 도와주세요ㅠ

QA

css로 다각형 모양을 잡고 border로 다각형 모양에 맞춰 테두리를 두르려 하는데 도와주세요ㅠ

본문

구글링해서 작업하는 방법은 찾앗는데 어느 영역을 수정해야 모서리를 아래쪽으로 가게 할수 있는지 모르겠습니다.ㅠ 코드는 이렇게 작성했습니다.

  1. position: relative;
  2. background-repeat: no-repeat;
  3. background-image: linear-gradient(#dfdfdf,#dfdfdf),linear-gradient(#dfdfdf,#dfdfdf),linear-gradient(#dfdfdf,#dfdfdf),linear-gradient(#dfdfdf,#dfdfdf),linear-gradient(to bottom left,transparent calc(50% - .5px),#dfdfdf calc(50% - .5px),#dfdfdf calc(50% + 0.5px),#fff calc(50% + 0.5px)),linear-gradient(#fff,#fff),linear-gradient(#fff,#fff);
  4. background-size: 1px 100%,1px 100%,100% 1px,100% 1px,30px 30px,100% 100%,100% 100%;
  5. background-position: 0 0,100% 30px,-30px 0,0 100%,100% 0,-30px 0,100% 30px;

 

지금 현재는 오각형으로 모서리 오른쪽 상단 위에가 잘려서 출력이 되는데 저는 오른쪽 하단 모서리가 잘려서 출력이 되었으면 좋겠습니다. 고수님들 도와주세요ㅠㅠ 어느 부분을 수정해야 지금 값처럼 오른쪽 상단 모서리 영역이 아닌 오른쪽 하단 모서리 영역으로 잘려서 출력될까요 부탁드립니다.ㅠㅠ 5시간동안 헤맷어요ㅠㅠㅠ

이 질문에 댓글 쓰기 :

답변을 작성하시기 전에 로그인 해주세요.
전체 123,535 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT