# cascading style sheets
배경 이미지에 blur 처리를 하고 싶어요.
blur 효과 모바일이나 웹사이트를 이용하다 보면, 기존의 화면 위에 팝업창과 같은 보조 창이 뜨게 될 경우 뒷 화면이 블러 처리가 되는 경우나, 배경 이미지가 블러처리 되어 있는 경우가 있다. 이 부분은 어떻게 처리하는 것이 좋을까? 배경이미지의 경우 포토샵에서 블
바깥 block box와 이미지 사이에 공백이 생겼어요. (feat. vertical-align)
img 공백 발생 block 박스 안의 inline 요소는 line-height로 인해서 gap이 발생한다. 이 것은 inline 요소가 해당 요소를 텍스트처럼 인식하기 때문이다. 기본적으로 컴퓨터 그리고 html은 서구 문화권에서 시작되었다. 때문에 자연스럽게 서
전환효과 및 애니메이션
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. Transitions (전환효과) (단축)속성의 시작과 끝을 지정하여 중간값을 애니메이션 위 코드는 순서대로 transition이 적용될 속성, 전환효과의 지속시간, 전환효과 타이밍 함수 이다.
CSS flex
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. flex-box 수평, 수직 정렬과 관련된 속성 (container, item로 이루어짐) display: flex : container가 block (flex container로 정의함!) di
CSS background, font
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. background(단축) -color : 배경색상 지정 -image : 요소에 하나 이상의 이미지 (다중이미지: 먼저 작성된 이미지가 위에 쌓임, ie 이하 불가능)를 삽입 -repeat :
CSS Box Model
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. Box 모델 css를 사용하여 브라우저의 화면을 구성하기 위해서는 box 모델을 이해하는 것이 매우 중요하다. css의 property중에는 html의 박스타입에 영향을 주는 property가 있
CSS 선택자와 상속
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. CSS selector 기본 선택자 * : (전체 선택자) 내부의 모든 요소를 선택 태그명 : (태그 선택자) 태그 이름을 선택자로 선택 .클래스이름 : (클래스 선택자) 클래스 이름을 선택자로
CSS 문법과 선언방식, 단위
아래 내용은 학원 수업 및 온라인 강좌 등을 듣고 정리한 내용입니다. CSS Declaration 문법 선택자 (속성과 값을 지정할 대상을 검색 및 선택), 속성, 값으로 구성 선언방식 inline : html의 요소에 직접 작성 (선택자가 별도로 필요하지 않음
