코딩

[CSS] MDN 정리2

계단식 및 상속 계단식 Cascading Style Sheet : 계단식 동일한 우선순위의 두 규칙 -> 마지막 규칙 적용 우선순위 선택자의 선택이 얼마나 중요한가 요소 선택자는 덜 구체적 -> 중요도↓ class 선택자는 구체적 -> 중요도↑ 상속 부모 요소에 적용된 CSS 속성은 자식요소에게 상속 width와 같은 일부 속성은 상속X 작동방식 상속 색상 : 직접 자식 + 간접 자식에 적용 special class 추가 상식적으로 상속됨 상속 제어 inherit : 상속에 영향O initial : 속성값이 상속 대신 기본 스타일시트 속성값 inherit unset : natural 값으로 재설정 (상속되면 inherit, 상속안되면 initial) 모든 속성 값 재설정 all : 상속 값을 모든 속성에..

[CSS] MDN 정리1

CSS 구문 CSS 규칙 h1 { color: red; font-size: 5em; } selector 중괄호 : 선언블록 선언 속성: 값 대소문자 구분 CSS 모듈 배경 및 테두리 모듈 CSS Working Group이 개발, 지정 CSS 시작하기 CSS 추가하기 head에 태그 추가 HTML 요소 스타일링 HTML 요소 = 선택자 다중 선택 : 쉼표 기본 동작 변경 가능 (list-style-type) class 항목 하나 항목 둘 항목 셋 /* CSS */ .special { color: orange; font-weight: bold; } 해당 class 를 가진 모든 요소를 대상으로 함 요소.class 가능 (li.special) 문서 위치에 따라 스타일 지정 li em { color: rebec..

[html] MDN 정리3

table : table data : table row : thable header colspan="2" rowspan="2" - : col마다 스타일 지정 : 주로 th의 첫번째 행, 바로 아래 : 마지막 행 : 나머지 부분 nested table 중첩 가능 연관성 : 헤더가 행/열의 헤더임을 나타냄 id & header

[html] MDN 정리2

이미지 : void element (자식노드X, 닫는 태그X), repalced element (스타일 적용X) src : URL alt : 이미지를 불러올 수 없을 경우 대체 텍스트 width : 가로 사이즈 height : 세로 사이즈 title : 추가 설명, 굳이 권장X - : 이미지와 캡션을 의미있게 연결 A T-Rex on display in the Manchester University Museum CSS background-image HTML image보다 위치조정이 쉬움 의미없는 장식용 이미지 p { background-image: url("images/dinosaur.jpg"); } 비디오/오디오 비디오 Your browser doesn't support HTML video. Here ..

[html] MDN 정리1

HTML Element의 구조 content 단일태그 : 속성 요소-속성, 속성-속성 사이 공백 속성 다음엔 등호(=) 속성값은 " "로 감싸기 생략 가능 but 오류 야기 ' ' & " " : 모두 가능하지만 혼용X 특수문자 표시에는 HTML entities 사용 bool 속성 : 값이 없는 속성, 속성의 이름과 동일한 하나의 값만 가질 수 있음 속성 사용 태그 역할 속성 사용 태그 역할 href 웹주소로 연결 title 링크에 대한 추가정보 target _blank: 새탭에서 열기 disabled bool 입력 비활성화 lang , 언어 설정 블럭 레벨 vs 인라인 블록레벨 줄바꿈 구조적 요소를 나타냄 단락, 목록, 네비게이션 메뉴, 꼬리말 표현 중첩 : 블록 ⊃ 블록 / 인라인 !⊃ 블록 인라인 항..