11월 29일, 패스트 캠퍼스에서 진행하였던 10월 100% 환급 챌린지 데일리 미션이 끝났다. 이제 최종 미션을 위해 이 글을 작성한다. 나는 프론트엔드 개발 올인원 패키지 with React Online. 강의를 통해 미션을 진행하였고,그동안 커리큘럼 상 HTML

배경 이미지의 크기를 설정속성 값auto : 배경 이미지가 원래의 크기로 표시됨 (기본값)단위px, em, % 등 단위로 지정width height 형태로 입력 가능 (120px 320px)width만 입력하면 비율에 맞게 지정됨 (120px)cover 배경 이미지의

배경 이미지의 반복을 설정속성 값repeat : 배경 이미지를 수직, 수평으로 반복 (기본값)repeat-x : 배경 이미지를 수평으로 반복repeat-y : 배경 이미지를 수직으로 반복no-repeat : 반복 없음배경 이미지의 위치를 설정속성 값% : 왼쪽 상단 모

요소의 배경을 설정속성 값background-color : 배경 색상기본값 : transparentbackground-image : 하나 이상의 배경 이미지기본값 : nonebackground-repeat : 배경 이미지의 반복기본값 : repeatbackground-

브라우저(뷰 포트) 기준으로 배치absolute 도 할 수 있으나, 명시적으로 fixed 를 선언해 주는 것이 좋음스크롤 영역 기준으로 배치top, left, right, bottom 중 하나의 값을 입력해야작동함IE 지원 불가요소가 쌓여 있는 순서를 통해 어떤 요소가

요소의 위치 지정 방법의 유형(기준)을 설정속성 값static : 유형(기준) 없음 / 배치 불가능 (기본값)relative : 요소 자신을 기준으로 배치absolute : 위치 상 부모 요소를 기준으로 배치fixed : 브라우저 (뷰포트) 를 기준으로 배치sticky

요소를 자우 방향으로 띄움 (수평 정렬)속성 값none : 요소 띄움 없음 (none)left : 왼쪽으로 띄움right : 오른쪽으로 띄움요소에 float 속성을 적용하면, 적용된 요소 주변으로 문자(text)가 흐르게 된다.각 요소에 float 속성이 있으면 차례로

문자의 장식(line)을 지정 (선에 대한 장식)속성 값none : 선 없음 (기본값)underline : 밑줄을 지정overline : 윗줄을 지정line-through : 중앙 선 (가로지르는) 을 지정(첫번째 줄의) 들여쓰기를 지정음수 값 사용 가능사용 시 첫째

글자의 크기를 지정속성 값단위 : px, em, cm 등 단위로 지정 (기본값 : 16px)% : 부모(상위) 요소의 비율로 지정이외 ...줄 높이 (간격)을 지정속성 값normal : 브라우저의 기본 정의를 사용(1~1.4) (기본값)숫자 : 요소 자체 글꼴 크기의

요소의 크기 이상으로 내용 (자식요소)이 넘쳤을 때, 내용의 보여짐을 제어속성 값visible : 넘친 부분을 자르지 않고, 그래도 보여줌 (기본값)hidden : 넘친 부분을 잘라내고, 보이지 않도록 함scroll : 넘친 부분을 잘라내고, 스크롤바를 이용하여 볼 수

요소의 '테두리 선'을 지정속성 값border-width : 선의 두께 (넓이) 기본값 : mediumborder-style : 선의 종류기본값 : noneborder-color : 선의 색상기본값 : black선의 두께(너비)를 지정속성 값medium : 중간 두께

요소의 '외부 (바깥) 여백' 을 지정음수 값 사용 가능속성 값단위 : px, em, cm 등 단위로 지정기본값 : 0auto : 브라우저가 너비를 계산% : 부모 요소의 너비(width)에 대한 비율로 지정요소의 '외부(바깥) 위쪽 여백' 을 지정요소의 '외부(바깥)

백분율 (%)vmax : 더 긴 뷰포트 넒이를 단위로 사용vmin : 더 짧은 뷰포트 넓이를 단위로 사용요소의 너비를 지정속성 값값 : auto의미 : 브라우저가 너비를 계산기본값 : auto (block : 100% / inline : 0px)단위 : px, em,

같은 요소가 여러 선언의 대상이 될 경우, 어떤 선언의 CSS 속성을 우선 적용할지 결정하는 방법명시도 점수가 높은 선언이 우선 (명시도)점수가 같은 경우, 가장 마지막에 해석(늦게 작성한)되는 선언이 우선 (선언 순서)명시도는 '상속' 규칙보다 우선 (중요도)impo

특정한 속성을 포함한 요소 선택속성 attr 을 포함하여 속성값이 value인 값을 선택속성 attr 을 포함하며 속성 값이 value 로 시작하는 요소 선택속성 attr을 포함하며 속성 값이 value로 끝나는 요소 선택fontfont-sizefont-weightfo

태그 이름과 동일한 타입인 형제 요소 중 태그이름과 n 번째 요소라면 선택n 키워드 사용 시 0 부터 해석 (Zero-base)특정 요소 내부의 앞에 내용(content)를 삽입주의 : content 속성을 꼭 작성해야 함이미지도 삽입 가능특정 요소 내부의 뒤에 내용(

E가 (같은 부모를 공유하는) 형제 요소 중 첫 번째 요소라면 선택형제 요소 중 마지막을 선택형제 요소 중 n번째 요소라면 선택(n 키워드 사용 시 0부터 해석(Zero-base))짝수 번째 요소만 선택3번째 요소부터 이후 요소들을 선택.fruits의 첫번째 자식 요소

속성과 값을 지정할 대상을 검색검색된 대상에 지정될 CSS 명령 세트문서 내 수정사항이나 설명 등을 작성 (주석)HTML 요소(태그)의 'style' 속성에 직접 작성하는 방식사용 빈도를 떠나서, 직접 입력하는 방식은 피해야 함HTML <style> 태그 안에 작

요소에 적용할 CSS를 선언요소의 정보(설명)을 지정마우스 hover 시 요소의 내용이 나타남요소의 언어를 지정사용자 정의 데이터 속성을 지정JavaScript에서 이용할 수 있는 데이터(정보)를 HTML에 저장하는 용도로 사용요소가 Drag and Drop API 를

<select> : 선택 메뉴 (드롭 다운)<optgroup> : 선택가능한 옵션을 그룹화<option> : 선택가능한 옵션<datalist> : 자동 완성 기능옵션을 선택하는 메뉴속성autocomplete :사용자가 이전에 입력한 값으로 자동 완