[CSS] #3 텍스트 관련 스타일 vol1 _ color : 글자 색 변경하기
·
Archive/WEB
#3 텍스트 관련 스타일 vol1 _ color : 글자 색 변경하기 [목차] 1. color 속성 2. 영문명 표기법 3. 16진수 표기법 4. hsl / hsla 표기법 5. rgb / rgba 표기법 *개인적인 공부 기록용으로 작성한 글이기에, 잘못된 내용이 있을 수 있습니다. #1 color 속성 웹 브라우저에서, 텍스트의 글자색을 바꿀 때 color 속성을 사용합니다. color를 사용할 수 있는 속성값은 ①영문명 ②16진수 ③hsl/hsla ④rgb/rgba 로 총 4가지 방식으로 나뉩니다. [기본형] color : #2 영문명 표기법 영문명 표기법이란, 글자의 색상을 red, yellow, white, black, blue 등과 같이 잘 알려진 색상 이름을 사용해 표기하는 방식 입니다. 다음..
[CSS] #2 글꼴 관련 스타일 font-family/ font-size/ font-weight
·
Archive/WEB
#2 글꼴 관련 스타일 [목차] 1. font-family - 글꼴 지정 2. font-size - 글자 크기 지정 3. font-weight - 글자 굵기 지정 * 개인적인 공부내용 정리용으로 작성한 게시글이기에, 잘못된 내용이 있을 수 있습니다. 1. font-family [기본형] font-family: | [, ] font-family 속성은 웹 문서에서 사용할 글꼴을 지정해 줄 때 사용합니다. 웹 문서에서 지정한 글꼴이 사용자의 컴퓨터 시스템에 없을 경우를 대비해서 대체 글꼴 이름을 지정해야 합니다. 예를들어, 다음과 같은 CSS 코드가 있다고 가정해 봅시다. body { font-family: "나눔 고딕", 바탕, 돋움 } 태그는 모든 태그들의 부모 태그 이기에, 웹 문서 전체 에 "나눔 고..
[CSS] #1 선택자 (전체 선택자/ 타입 선택자/ 클래스 선택자/ id 선택자)
·
Archive/WEB
[CSS] #1 선택자 [목차] #1 전체 선택자 [universal selector] #2 타입 선택자 [type selector] #3 클래스 선택자 [class selector] #4 id 선택자 [id selector] #5 id 선택자 vs 클래스 선택자 * 개인적인 공부내용 정리용으로 작성한 게시글이기에, 잘못된 내용이 있을 수 있으며 지속적으로 수정해 나갈 예정입니다. 선택자란, 웹문서에 스타일을 적용할 태그(부분)을 알려주는 역할을 하는 것으로 선택자의 종류는 [전체 선택자] [타입 선택자] [클래스 선택자] [ID 선택자] 4가지로 구분합니다. #1 전체 선택자 [universal selector] 전체 선택자는 문서의 모든 요소에 스타일을 적용할 때 사용하며, *(별표)를 사용합니다. ..
[CSS] Style - Inline Style & Internal Style & External Style
·
Archive/WEB
#1 Style 웹에서 Style 이란 HTML 문서에서 사용하는 글꼴, 정렬, 색상 등 문서의 겉모습을 결정짓는 것을 의미합니다. HTML로는 웹 사이트의 내용을 나열하며, CSS로는 웹의 디자인을 구성하자는 아이디어가 웹표준의 시작이며, 이렇게 내용과 디자인을 구분해 두면, 사이트의 내용을 수정할 때 내용에 영향을 미치지 않고 디자인만 변경이 가능하기에 매우 편리합니다. CSS의 기본 스타일 형식은 다음과 같습니다. 선택자 { 속성1: 속성값1; 속성2: 속성값2 } ① 선택자 : 스타일을 어느 에 적용할 것인지 명시합니다. 예를들어 제목을 나타내는 태그에 스타일을 적용하고자 한다면, 선택자 부분에 h1을 적습니다. ② 속성&속성값 : 속성과 속성값을 합쳐서 스타일 규칙이라고 부르며, 세미콜론(;)으..