CSS

요소의 상하위아래 바깥 여백을 설정함margin-top, margin-right, margin-bottom, margin-left 의 단축 속성으로 margin을 사용할 수 있음두 개 이상의 요소는 위 아래 여백이 종종 합쳐져 하나의 여백이 되는 여백 상쇄가 일어날 수

Cascading Style Sheets서로 다른 원점에서 가져온 속성 여럿을 조합하여 최종 결과를 도출해내는 알고리즘종속되는 것이 가장 큰 핵심우선순위에 따라 스타일이 결정됨캐스캐이딩이 많이 발생되면 성능이 저하된다는 단점이 있음User-agent Style Shee

과거에 ::before 사용시 콜론:을 하나만 입력하여 :before로 작성했었는데, 어느날부터 콜론을 두개씩 입력하기 시작했다. 이유가 뭘까?의사 요소 Pseudo-elements가상 element를 만들어 특정 부분에 스타일을 적용하기 위해 사용됨의사 클래스 Pse

블록 서식 맥락(block format context)은 웹 페이지를 렌더링하는 시각적 CSS의 일부로서, 블록 박스의 레이아웃이 발생하는 지점과 플로팅 요소의 상호작용 범위를 결정하는 범위입니다. -MDN MDN을 비롯한 타 사이트들은 BFC를 위와 같이 정의하였다.

지난 포스팅에서 BFC(Block Format Context, 블록 서식 맥락)에 대해 알아보았다. Normal Flow(일반 대열)은 BFC이 적용되지 않은, 원형의 레이아웃 흐름이다. 이번에는 Normal flow에 대해 알아보자. Normal Flow란?

어떠한 요소의 크기와 위치에 영향을 주는 것대부분 가장 가까운 블록 레벨 조상의 콘텐츠 영역이 되지만, 예외가 있음width, height, padding, margin 값과 절대 위치(absolute, fixed 등)로 설정된 요소의 offset 값은 자신의 컨테이닝

하나의 요소에 background 속성으로 위 사진처럼 여러장의 이미지와 색깔이 겹쳐진 것을 만들 수 있을까? 정답을 알아보기 위해 background 속성을 살펴보자. background 속성은? 색상, 이미지, 원점, 크기, 반복 등 여러 배경 스타일을 하나

퍼블리셔, 프론트엔드 개발자라면 의미가 있는 이미지를 사용할 때 이미지의 대체 텍스트를 반드시 작성해주어야 한다는 말을 들어보았을 것이다. 웹 접근성의 측면에서 개발자는 이미지를 볼 수 없는 환경이나 저시력 사용자, 시각 장애인에게 이미지로 표현된 내용을 알려줄 의무가

CSS 전처리기(Pre-Processor) 중 하나로, CSS 확장 언어이다. 이러한 Sass는 변수, 중첩 규칙, 믹스인, 함수 등을 사용할 수 있는 환경을 제공하며 모든 CSS 버전과 호환이 가능하여 CSS를 보다 쉽게 관리할 수 있다. Sass의 종류로는 Dart

Scss 사용 출력될 scss 파일에 다른 scss 파일 첨부하는 법 reset, font 등 기반이 되는 scss 파일은 base 폴더에 _파일명.scss 로 저장 변수 $variable 선언 방법 전역변수, 지역변수 구분 가능 value에 number, s