메뉴 보이기
댓글0
[css] 안드로이드 모바일 링크 클릭 선택시 하이라이트 파란색배경음영 지우기
.noSelect { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } 참참조 : https://stackoverflow.com/ques...
2019.10.10 조회 4 댓글 0 추천 0
flex 설명한 글 모음.
https://www.vobour.com/2-flexbox-이해-당신이-알아야-할-모든-것-understa https://developer.mozilla.org/ko/docs/Web/CSS/CSS_Flexible_Box_Layout/Flexbox의_기본_개념 https://developer.mozilla.org/ko/docs/W...
2019.09.09 조회 17 댓글 0 추천 0
[SVG] svg 파일을 id값으로 클래스화해서 사용하기
svg 파일을 id값으로 클래스화해서 사용하기 <svg><symbol id="ID명"></symbol></svg> 이렇게 심볼로 만든 다음에 <svg><usr xlink:href="#ID명"></use></svg> 이런 식으로 사용 가능하네요. <svg class="클래스명">...
2019.01.07 조회 36 댓글 0 추천 0 출처 https://codepen.io/marcobiedermann/pen/kjwzC
[SCSS] [SCSS] SCSS문법 정리 네스팅 변수 @import @mixin @include @for @each @while
SCSS = SASS + CSS SASS 컴파일러로 SCSS파일이 CSS파일이 됨 - SCSS는 CSS를 보다 효율적으로 보다 편리하게 사용하기 위해 만들어진 언어다. SASS와 CSS의 중간쯤이라고 볼 수 있지만 SASS를 몰라도 SCSS는 할 수 ...
2018.09.01 조회 119 댓글 0 추천 0 출처 https://blog.naver.com/kira4195/221262057145
[그리드] flex 개념 알기
(번역) CSS flex box 3분만에 배우기 https://joshuajangblog.wordpress.com/2016/09/19/learn-css-flexbox-in-3mins/ > flex 의 기본 개념에 대해서 가장 간단하게 설명한 글입니다. CSS Flexbox https://www.w3scho...
2018.08.25 조회 59 댓글 0 추천 0
[css] parallax only css
css <style> .parallax { /* The image used */ /* Full height */ height: 100%; /* Create the parallax scrolling effect */ background-attachment: fixed; background-position: center; background-repeat: no-...
2018.08.14 조회 32 댓글 0 추천 0 출처 https://www.w3schools.com/howto/howto_css_parallax.asp
[css] 마진 상쇄 현상 해결팁
마진 상쇄 현상을 해결하는 방법으로 여러 가지 방법이 있겠습니다만, 개인적으로는 display:inline-block;width:100%; 를 이용합니다.
2018.07.30 조회 103 댓글 0 추천 0
[SVG] CSS HEXAGON
https://codepen.io/eond/pen/xWQgGB ">
2018.04.19 조회 23 댓글 0 추천 0
[css] CSS animation infinite
@keyframesBefore applying animations to HTML elements, you need to write animations using keyframes. Basically, keyframes are each intermediate step in an animation. They are defined using percentages:...
2018.04.13 조회 14 댓글 0 추천 0 출처 https://marksheet.io/css-animations.html
[css] CSS로 Center 정렬
/* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; ju...
2018.01.13 조회 25 댓글 0 추천 0
[css] css 선택자 | CSS [attribute*=value] Selector
CSS [attribute*=value] Selectorhttps://www.w3schools.com/cssref/sel_attr_contain.asp example https://www.w3schools.com/cssref/tryit.asp?filename=trycss3_attr_contain div[class*="test"] { background: #f...
2018.01.02 조회 23 댓글 0 추천 0
[CSS아이콘] social Icon with XE icon
See the Pen socialIcon with XEicon by eond (@eond) on CodePen.
2017.12.22 조회 65 댓글 0 추천 0 출처 https://codepen.io/eond/pen/GyjWBz
[css] ul 컬럼 다단
ul > li 로 꾸몄는데 1 2 3 4 5 6 7 8 9 이렇게 나오는 스타일을 1 4 7 2 5 8 3 6 9 이런 형식으로 나오게 하는 방법입니다. #col { -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
2017.12.20 조회 67 댓글 0 추천 0 출처 https://developer.mozilla.org/ko/docs/CSS3_Columns
[input] input 속성 중 placeholder 의 색 바꾸기
::-webkit-input-placeholder { color: #CCC; } /* Firefox 4-18 */ :-moz-placeholder { color: #CCC; } /* Firefox 19+ */ ::-moz-placeholder { color: #CCC; } /* IE10+ */ :-ms-input-placeholder { color: #CCC...
2017.09.25 조회 60 댓글 0 추천 0 출처 https://nizbridge.github.io/all/html-css...older.html
[CSS아이콘] Animated dots icon
[js] $(document).ready(function(){ $('#menu-trigger').click(function(){ $(this).toggleClass('active'); }); }); 출처 : http://codepen.io/elliottmangham/pen/RoVwRm
2017.03.30 조회 58 댓글 0 추천 0 출처 http://codepen.io/elliottmangham/pen/RoVwRm
[css] [CSS] 배경 이미지에만 흐림효과(Blur) 적용하기 :: Life is an egg.
참조 http://codepen.io/akademy/pen/FlkzB http://nubiz.tistory.com/443
2017.03.27 조회 832 댓글 0 추천 0 출처 http://codepen.io/akademy/pen/FlkzB