박스모델 - html의 요소들은 box 형태의 영역을 가지고있는데 이것을 박스모델이라고한다. - 이 box는 *컨텐츠 패딩 테두리 마진* 으로 구성된다. - 브라우저는 박스모델의 크기와 프로퍼티의 위치를 근거로하여 view(렌더링)를 실행한다. ※ content : 요소의 텍스트(실질적 내용/이미지)가 위치하는 영역 padding : 테두리 안쪽에 위치하는 영역 border : 요소의 기준선 margin : 테두리 바깥족에 위치하는 외부영역 ※ 마진 패딩 사용 시 주의사항 - 마진과 패딩은 전체 높이와 너비 계산에 일반적으로는 포함된다 - 설정에 따라 마진 패딩크기를 포함하지 않도록 바꿀 수 있음 ※ box-sizing: border-box; - 마진과 패딩의 전체 넓이와 높이 계산의 기준을 바꾸는 속성..

display inline-block 처리 시 리스트가 가로로 배치된다 적용 시 HTML 삽입 미리보기할 수 없는 소스

링크의 상태 1. link : 한번도 해당 링크를 통해 연결된 페이지를 방문하지 않은 상태 2. visited : 유저가 한번이라도 해당 링크를 통해 연결된 페이지를 방문한 상태 3. hover : 유저의 마우스 커서가 링크에 올라가 있는 상태 4. active : 유저가 마우스로 링크를 클릭하고 있는 상태 hover 적용 예시 a:hover{ color : green; background-color : yellow; }

테이블 관련 속성 1. border - 일반적으로 테이블에 border테두리를 적용하면 두 줄로 보이며 테이블에 선이 두 줄로 보이는 이유는 th, td태그가 각각 자신만의 테두리를 가지고 있기 때문이다 2. border-collaspe - 해당 테이블의 테두리를 한 줄로만 표현 3. border-spacing - 테이블 요소간의 여백 설정 4. empty-cells - 빈 셀들의 테두리나 배경색 표현여부 기본 요소 이름 성별 기타 김김김 남자 바보 이이이 여자 천재 border-collaspe 미적용 시 border-collaspe 적용 시 border-collapse: collapse;

css font 속성 1. font-family : 글꼴 지정 - 여러개의 글꼴을 같이 설정 가능 2. font-style : 기울임 등의 지정 3. font-variant : 대소문자 조정 4. font-weight : 글자 두께 5. font-size : 텍스트 크기 설정 css 텍스트 속성 direction : 텍스트의 작성 방향 설정 color : 글자 색 설정 letter-spacing : 글자 사이의 간격 word-spacing : 단어(공백) 사이의 간격 text-align : 정렬(수평) vertical-align : 정렬("수직") - 해당 요소의 속성을 강제로 table-cell로 바꿔서 적용 text-decoration : 텍스트에 효과 설정or제거 line-height : 줄간격 설..

배경 - html의 모든 요소들은 각자의 배경을 가지고 있으며 설정이 가능 css background 1. background-color - 배경색 설정 2. background-image - 배경으로 나타낼 이미지 설정 3. background-repeat - 이미지의 반복 4. background-position - 반복되지 않는 배경이미지의 상대 위치 설정 5. background-attachment - 위치 고정 6. background(shorthand) - 속성명을 일일이 쓰지 않고 한줄에 전부 모든 속성을 표현하는 방법 ex) background : color / image │ repeat │ attachment │ position

css 색상 1. 색상명으로 표현 - w3c에서 정의한 16가지 표준 색상이 있다. 2. RGB 색상값으로 표현 - 0~255사이의 값으로 표현(RGB(red, green, blue)) 3. 16진수 색상값으로 표현 - #000000 ~ #FFFFFF ※RGB와 16진수 색상표는 인터넷에서 쉽게 검색하여 확인가능

CSS(Cascading Style Sheets) - 구조화된 문서(HTML)에 어떤식으로 랜더링 할 것인지를 정의하는 언어 - CSS는 HTML등 각 요소의 스타일을 정의하여 화면에 어떻게 랜더링하면 되는지 브라우저에게 설명해주는 언어(스타일시트) CSS 관련 용어 1. 셀렉터(선택자) - CSS를 통해 HTML 요소의 스타일을 적용하고자 할 때 그 해당요소를 선택하는 방법이자 수단 ⓐ 선택자의 종류 1) html 선택자 - 태그명 그 자체를 작성 2) id 선택자(단수) - #ID명 3) class 선택자(복수) - .class명 4) 그룹선택자 - 여러개의 태그, id 클래스 작성후로 구분 2. CSS문법 // 선택자 선언시작 속성명(프로퍼티) 선언구분자 속성값 선언구분자 선언끝 h1 { backg..