1. background-color 속성배경색 지정, 색상 단위 입력 (디폴트: 하얀색) 2. background-image 속성 배경 이미지 지정, url 단위 입력 1) background-repeat : 배경 이미지의 반복형태 지정- repeat-x : x축으로 반복 - repeat-y : y축으로 반복 - repeat : x, y축으로 반복 - 디폴트 repeat, 싫으면 no-repeat 2) background-position: 배경이미지의 위치 지정 - x축위치 y축위치 - 키워드: top, bottom, right, left, center 3) background-size : 배경 이미지의 크기 지정- width height- cover: 이미지의 비율을 유지한 상태에서, 부모요소의 wid..

1. Font 1) font-size : 글자의 크기 지정 속성 2) font-family : 글꼴 지정 속성- 글꼴 이름이 2단어 이상이면 ""으로 묶어줘야한다 - 되도록 모든 컴퓨터에 있는 폰트를 사용하는 것이 좋다- 사용자의 컴퓨터 환경에 따라 글꼴이 없을 수 있으므로 여러 글꼴을 지정해 대비해 놓을 수 있음 font-family: "Times New Roman", Times, serif; -> "Times ~"이 없으면 Times, Times도 없으면 serif 사용 3) font-style : 글자 기울기 조절 (italic, ..)4) font-weight : 글자 굵기 조절 (bold, ..)​2. Text 1) text-align: 글자 정렬 (center, right, left) -> 수..

1. float 속성웹 요소를 문서 위에 떠 있게 (배치되게) 만든다- left : 해당 요소를 왼쪽으로 배치- right : 요소를 오른쪽으로 배치- none : 기본값. 왼쪽도 오른쪽도 X- float 종료 -> {clear: both} ​​2. 요소 정렬 1) 수평 정렬 (가로로 가운데 정렬) - Block tag의 경우: {margin : 0px auto;}- Inline Tag의 경우: {padding: 좌우 패딩값을 통일;}- Text의 경우: text-align2) 수직 정렬 (세로로 가운데 정렬) - Inline Tag의 경우: {padding: 상하 패딩값을 통일;}- line-height : 수치를 텍스트 태그의 높이와 일치시킴 ​​3. position 속성웹 문서 안의 요소들을 자유자..

1. display 속성요소가 화면에 보이는 방식을 지정하는 속성 (요소의 속성을 변경시킴) - inline: 태그를 인라인 형식으로 지정 (contents의 크기만큼 자리 차지), margin 적용 불가- block: 태그를 블록 형식으로 지정 (contents가 있는 한 줄 전체 차지), 크기 지정, margin 적용 가능- inline-block: inline 속성과 block 속성을 모두 가짐 - none: 화면에 출력 X, 공간 X (없는 태그 처럼 취급)​2. visibility 속성요소가 화면에 보이게 할지 말지를 지정하는 속성 - visible: 화면에 보임 - hidden: 화면에서 안보이게 함 - collapse: 테이블 태그에서 사용하는 속성으로 테이블의 행과 열을 숨김 ​3. opa..

​1. width와 height 컨텐츠의 가로, 세로 크기 지정 ​2. border : 테두리 속성 - Top, Left, Bottom, Right- 선의 두께(border-width), 형태(border-style), 색상(border-color) 지정 가능. 위의 속성을 순서대로 한번에 지정하는 것도 가능하다. 예) border: 1px solid black; - border-radius : 테두리에 둥근 사각형이나 원을 표현하는 속성 - table의 border 속성들 > border-spacing : 테두리 간의 간격 > border-collapse : 선 분할 여부 (seperate, collapse)​3. margin요소와 요소 사이의 간격 (박스와 박스 사이의 간격)- 마진 적용 순서: T..

1. 기본 선택자 (중요)*전체 선택자HTML 문서 안의 모든 데이터 선택* {color: red;} 태그명태그 선택자 HTML 문서 내부의 특정 태그를 모두 선택h1{color: blue;}#아이디명id 선택자특정 id 속성이 있는 태그를 선택#t1{color:yellow;}.클래스명class 선택자특정 클래스 속성이 있는 태그를 선택 .c1{color:pink;}- 선택자 적용 순서: 먼저 body를 지나면서 태그들에 지정된 속성을 적용 -> 나머지에 전체 선택자의 속성 적용 - 아이디 선택자: 웹페이지 내부에서 중복되면 안됨. 특정한 하나의 태그를 선택할 때 사용- 클래스 선택자: 하나의 class로 여러 태그를 묶는데 사용한다. class 중복 가능 - 태그 선택자와 클래스 선택자: 여러 li 태..