반응형 전체 글11 [CSS] 반응형 CSS 단위 총정리 [CSS] 반응형 CSS 단위 총정리 도입 어떤 단위든 브라우저에서는 px(pixel - 픽셀)로 변환되어 화면에 표시된다. 픽셀이란 모니터 위에서 화면에 나타낼 수 있는 가장 작은 단위를 의미한다. 픽셀은 절대적인 값이라 container의 사이즈가 변경되어도 content의 크기는 그대로 유지된다. 브라우저에서 font-size를 변경해도 변경된 크기에 반응하지 않음 -> 고정적 따라서 대부분 %를 이용하여 content의 크기가 유동적으로 변할 수 있도록 한다. 단위에 대한 설명 em (Relative to parent element) 현재 지정된 font-size를 나타내는 단위이다. 같은 font-size여도 다른 font-family를 사용한다면 사용자에게 보여지는 크기가 달라질 수 있다. e.. 2023. 8. 2. [CSS] Flexbox란? 1 [CSS] Flexbox란? Part1 Flex란? Flex란 웹사이트의 DOM Element들을 정렬하기 위한 속성이다. Flex를 이용하면 디바이스의 너비에 따른 반응형 UI를 구현하기 용이하며, DOM Element 정렬에 많이 사용하는 float보다 추가로 필요한 작업이나 부작용이 적기 때문에 더 장점이 많은 정렬 방법이다. 이외에도 대부분의 브라우저에서 지원하기 때문에 크로스 브라우징 측면에서도 안정적인 방법이다. Flex 적용하기 item들을 정렬하기 위해서는 먼저 부모 요소에 flex 속성을 적용해야한다. 아래의 html코드를 예로 들면 parent 클래스를 가진 요소에 적용하면 된다. AAAAAAAAAAAAAAA BBB CCCCCC 아래와 같이 정의를 해보자. .parent { displa.. 2023. 8. 2. [BOJ12865] 평범한 배낭 [BOJ12865] 평범한 배낭 문제 링크 BOJ12865 - 평범한 배낭 문제 설명 N(1 2022. 3. 16. [Pattern] Flux Flux 패턴이란? MVC 패턴의 문제점을 해결하기 위해서 페이스북이 고안한 아키텍쳐 설계 패턴이다. Flux 패턴은 데이터가 단방향으로 흐르게 해서 여러 데이터 갱신 작업이 한번에 하나의 데이터만 변경하도록 한다. 이를 통해서 여러 데이터가 한번에 변경되는 상황을 예방하여 데이터를 예측 가능하도록 하는 데에 목적이 있다. MVC 패턴의 문제점 Flux를 알아보기 전에 먼저 MVC 패턴에서 발생하는 문제를 알아보았다. MVC는 Model, View, Controller로 이루어진다. 사용자의 액션이 발생하면 Controller가 Model을 업데이트하고, Model을 나타낼 View를 골라서 사용자에게 보여주는 방식으로 동작한다. MVC의 각 구성 요소를 살펴보면, Controller는 View를 통해서.. 2022. 2. 16. 이전 1 2 3 다음 반응형