color

1 개요
2 문법
3 예제

개요

color로 텍스트의 색을 정합니다.

상속 : Yes
애니메이션 : Yes
버전 : CSS Level 1

문법

color: color | initial | inherit

color : 색을 정합니다.
initial : 기본값으로 설정합니다.
inherit : 부모 요소의 속성값을 상속받습니다.

예제

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>CSS</title>
    <style>
      .jb-red {
        color: red;
      }
    </style>
  </head>
  <body>
    <h1 class="jb-red">Lorem ipsum dolor sit amet.</h1>
  </body>
</html>

CSS / Reference / text-decoration

text-decoration은 선으로 텍스트를 꾸밀 수 있게 해주는 속성입니다. 기본값 : none 상속 : No 애니메이션 : No 버전 : CSS Level 1

CSS / Reference / list-style-position

list-style-position으로 ul, ol 등의 목록의 마커(marker)의 위치를 정합니다. 기본값 : outside 상속 : Yes 애니메이션 : No 버전 : CSS Level 1

CSS / Reference / color

color로 텍스트의 색을 정합니다. 상속 : Yes 애니메이션 : Yes 버전 : CSS Level 1

CSS / Reference / tab-size

HTML은 탭을 연속하여 여러 개 넣어도 하나의 공백으로 인식합니다. 하지만 pre 태그를 이용하면 입력된 그대로 출력할 수 있습니다. 기본적으로 하나의 탭을 8개의 공백으로 인식합니다. 이 탭 크기를 조정하는 속성이 tab-size입니다.

CSS / Reference / list-style-type

목록은 ul 태그 또는 ol 태그로 만듭니다. 목록 앞에 붙는 도형이나 문자을 마커(Marker)라고 하는데, 어떤 형식 또는 어떤 모양의 마커를 사용할지는 list-style-type으로 정할 수 있습니다.

CSS / Reference / background-color

background-color로 배경의 색을 정합니다. 그 색으로 border와 padding을 포함한 영역을 칠합니다. margin 영역은 칠하지 않습니다. 기본값 : transparent 상속 : No 애니메이션 : Yes 버전 : CSS Level 1

CSS / Reference / border-style

border-style은 테두리(border)의 모양을 정하는 속성으로, 다음 속성의 단축 속성입니다. border-top-style border-right-style border-bottom-style border-left-style

CSS / Reference / background-position

background-position은 배경 이미지의 위치를 정하는 속성입니다. 기본값 : 0% 0% 상속 : No 애니메이션 : Yes 버전 : CSS Level 1

CSS / Reference / background-image

background-image는 이미지를 배경으로 사용하게 하는 속성입니다. 기본값 : none 상속 : No 애니메이션 : No 버전 : CSS Level 1

CSS / Reference / calc()

calc()는 괄호 안의 식을 계산한 결과를 속성값으로 사용하게 해주는 함수입니다. 예를 들어 다음은 는 글자 크기를 20px로 설정합니다. font-size: calc( 10px + 10px );