2019 1월 첫 주 개발 아티클
개발 일반 번역 2019년, 프론트엔드 개발자는 여전히 좋은 선택일까? – 프론트엔드개발에 대한 장점/단점/갖춰야할 역량들을 짚어보는 글. 트렌드에 흔들리지 않기 위해서 프레임워크보다는 기본 개념과 원리를 공부하는 것에 대해 강조하고...
css
[CSS] 반응형으로 정사각형 만들기
결론: after요소에 padding-bottom을 100% 넣어주면 된다. 내부에 다양한 크기에 컨텐츠가 있다면, position: absolute인 width, height 100%인 div로 감싸준다. <div class="note"> <div class="inner"> <div class="title">{noteData.title}</div> </div> </div> .note {...
Flexbox 활용사례 모음: Solved by Flexbox
Flexbox는 웹페이지에서 다양한 레이아웃을 만들기 위해서 쓸 수 있는 최신 CSS 기능이다. 사실 지금까지 CSS를 이용해서 레이아웃을 만드는 것이 그리 간단한 일은 아니었다. 수직 중앙 정렬은 잘 알려진...
기술 링크 정리 #1 – 2016/12/09
파이썬 관련 Python 3.6.0 RC1 Python3.6.0 Release Candidate1 에 대한 내용을 담고 있다. 에 가면 좀더 자세한 내용을 볼 수 있다. CPython 구현 개선에 대한 내용이 있는데, dict...
[CSS] div에 의도하지 않은 여백이 들어가 있을 때
Problem btn-container라는 div에 btn-group 3개 div를 넣었더니 그 3개 div 사이에 틈이 생겼다. Solution whitespace를 주석처리 <div>text</div> <!-- --> <div>text</div> <!-- --> <div>text</div> <!-- --> <div>text</div> <!-- -->...
Bootstrap 그리드 시스템
Bootstrap3 Grid http://getbootstrap.com/css/#grid 참조. - .col-xs- : Phone ( < 768px ) - .col-sm- : Tablets ( ≥768px ) - .col-md- : Desktops ( ≥992px ) - .col-lg-...
구글 웹폰트를 빠르게 로드하는 팁 7가지
원문 : 7 Tips to Load Google Web Fonts Faster 어떻게 사이트에서 구글 폰트를 빠르게 로드할 수 있을까? 스타일되지 않거나 다른 기본 폰트가 로드된 다음에 번쩍거리며 구글 웹...