CSS11 [CSS] 기본 속성 - 텍스트 CSS text 속성 1. color 2. direction 3. letter-spacing 4. word-spacing 5. text-indent 6. text-align 7. text-decoration 8. text-transform 9. line-height 10. text-shadow 1. color - 텍스트의 색상 설정 - 기본 색상 = 검정색 - 각 요소별로 따로 명시된 속성값이 태그의 속성값보다 우선 적용 body { color: red; } p { color: maroon; } 2. direction - 텍스트가 써지는 방향 설정 - left-to-right(ltr) : 왼쪽 -> 오른쪽 (기본) - right-to-left(rtl) : 오른쪽 -> 왼쪽 .rightToLeft { di.. 2021. 11. 1. [CSS] 기본 속성 - 배경 CSS background 속성 1. background-color 2. background-image 3. background-repeat 4. background-position 5. background-attachment 1. background-color - HTML 요소의 배경색 설정 body { background-color: lightblue; } h1 { background-color: rgb(255,128,0); } p { background-color: #FFFFCC; } 2. background-image - HTML 요소의 배경 이미지 설정 - 전체에 걸쳐 수평과 수직 방향으로 반복되어 나타남 body { background-image: url("/examples/images/img.. 2021. 11. 1. [CSS] 기본 속성 - 색 CSS 색 표현 방법 1. 색상 이름으로 표현 2. RGB 색상값으로 표현 3. 16진수 색상값으로 표현 1. 색상 이름으로 표현 - W3C에서 정의한 16개의 HTML4 표준 색상 이름 aqua black blue fuchsia gray green lime maroon navy olive purple red silver teal white yellow - 대소문자 구분 X 2. RGB 색상값으로 표현 - 빨간색(Red), 녹색(Green), 파란색(Blue)으로 색 표현 - 각각 0 ~ 255 의 범위 .blue { color: rgb(0,0,255); } 3. 16진수 색상값으로 표현 - RGB 색상값을 각각 16진수로 변환 - 00 ~ FF 의 범위 .blue { color: #0000FF; }/*.. 2021. 11. 1. [CSS] CSS 적용 CSS를 적용하는 방법 1. 인라인 스타일(Inline style) 2. 내부 스타일 시트(Internal style sheet) 3. 외부 스타일 시트(External style sheet) 1. 인라인 스타일(Inline style) - HTML 요소 내부에 style 속성을 사용하여 적용 - 해당 요소에만 적용됨 인라인 스타일을 이용하여 스타일을 적용하였습니다. - 스타일 변경이 어렵고 스타일 시트의 이점이 없게 되므로 필요한 경우에만 사용할 것 2. 내부 스타일 시트(Internal style sheet) - 3. 외부 스타일 시트(External style sheet) - 웹 사이트 전체의 스타일을 하나의 파일에서 변경 - .css 확장자 사용 - - 외부 스타일 시트를 사용하는 것이 유지 보수.. 2021. 11. 1. [CSS] CSS 문법 CSS 문법 - 선택자(selector) : CSS 를 적용하고자 하는 HTML 요소(element) - 선언부(declaratives) : 하나 이상의 선언들을 세미콜론(;)으로 구분하여 포함, 중괄호 { } 로 전체를 둘러쌈 - 각 선언은 CSS 속성명과 속성값을 가지며 콜론(:)으로 연결 - CSS 선언은 마지막에 세미콜론(;)으로 끝 CSS 선택자 - HTML 요소 선택자 - 아이디(id) 선택자 - 클래스(class) 선택자 - 그룹(group) 선택자 HTML 요소 선택자 - HTML 요소 이름을 직접 사용 ... 이 부분에 스타일을 적용합니다. 아이디(id) 선택자 - 특정 요소를 선택할 때 사용 - 특정 아이디 이름을 갖는 요소 선택 #아이디 ... 이 부분에 스타일을 적용합니다. - HT.. 2021. 11. 1. 이전 1 2 다음
