본문 바로가기

CSS

(2)
Vue.js : 시작하기 1.Vue.js 란Vue.js는 UI 를 만들기 위한 자바스크립트 프레임워크입니다.기존의 JSP로 구현되어 있는 사이트에도 쉽게 적용가능하며, vue-router와 같은 라이브러리를 사용하면 SPA(Single Page Application) 아키텍처 구성 또한 가능합니다. 또한 ES6와 Webpark의 번들링을 통해 대규모 애플리케이션을 단일 파일 컴포넌트(Single File Componemts)로 빌드하여 복잡도를 줄일 수 있습니다. 데이터 바인딩 과 화면 단위를 컴포넌트 형태로 제공하며 관련 API 를 지원Angular 에서 지원하는 2 way data bindings 을 동일하게 제공다른 Front-End FW (Angular, React) 와 비교했을 때 훨씬 가볍고 빠름러닝커브가 낮고, 쉽게..
CSS : 요소 및 레이어 중앙정렬 방법 퍼블리싱을 진행하다보면 레이어를 가운데정렬 할 일이 빈번하게 일어나는데요, 텍스트의 중앙정렬은 text-align 이나 line-height 를 이용하지만 레이어 중앙정렬은 어떻게 해야할까요? 하단에보이는 박스로 예시를 보여드리겠습니다. BOX position:absolute 와 margin 마이너스값 을 이용한 방법 우선, 가장 일반적이면서 간단한 방법입니다. 60px 이라는 정사각형 박스라고 가정하에 부모요소인 wrap 에 position: relative 로 기준을 잡고, 박스에 position: absolute 를 50% 씩 걸면 좌표의 기준이 박스 상단으로 잡히기때문에 기준점은 박스 상단을 기준으로 정렬이되어 중앙정렬이 되지않습니다. 이러한 경우에는 margin 값으로 박스의 절반만큼 마이너스 ..