Notice
Recent Posts
Recent Comments
Link
- Arawn's Dev Blog
- Outsider's Dev Story
- Toby's Epril
- Benelog
- NHN 개발자 블로그
- SK 플래닛 기술 블로그
- OLC CENTER
- 소프트웨어 경영/공학 블로그
- 모바일 컨버전스
- KOSR - Korea Operating System …
- 넥스트리 블로그
- 리버스코어 ReverseCore
- SLiPP
- 개발자를 위하여... (Nextree 임병인 수석)
- "트위터 부트스트랩: 디자이너도 놀라워할 매끈하고 직관…
- Learning English - The English…
- real-english.com
- 'DataScience/Deep Learning' 카테…
- Deep Learning Summer School, M…
- Deep Learning Courses
민서네집
css로 속이 빈 역삼각형 만들기 본문
[참고] http://stackoverflow.com/questions/18606253/how-to-create-hollow-triangle-in-css
[Test] http://jsfiddle.net/wmDNr/3/
.triangle { position: relative; margin-top: 0; margin-right: 20px; width: 24px; height: 23px; display: inline-block; } .triangle>div { width: 24px; height: 2px; background: #91c741; } .triangle>div:before { content: " "; display: block; width: 24px; height: 2px; background: #91c741; -webkit-transform: rotate(-60deg); -moz-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); position: absolute; top: 10px; right: -6px; } .triangle>div:after { content: " "; display: block; width: 24px; height: 2px; background: #91c741; -webkit-transform: rotate(60deg); -moz-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); position: absolute; top: 10px; left: -6px; }
'WEB (HTML, CSS)' 카테고리의 다른 글
IE(Internet Explorer)의 호환성 문제 해결 (0) | 2014.12.12 |
---|---|
jQuery Ajax IE8,9 Cross Domain Security Issue (0) | 2014.12.09 |
Fluid width with equally spaced DIVs (0) | 2014.11.19 |
개인정보취급방침 회원가입약관 만들기를 도와주는 웹사이트 소개 (0) | 2014.10.31 |
Gradation CSS 만들어주는 사이트 (1) | 2014.10.22 |
Comments