본문으로 바로가기



이번 시간에는 CSS 에서 color 속성에 대해 알아보도록 하겠습니다.


color 속성


color 속성은 상당히 간단합니다. 말 그대로 색상을 적용하는 것인데요. 배경 색인지, 텍스트의 색인지 구분이 애매합니다. color 속성은 텍스트의 색상, 다음 시간에 알아볼 background-color 속성은 배경 색상입니다.


예제를 한번 참고해 보시죠. ▼


1
2
// HTML
<p><span class="color">빨간</span>색 글자는 <span class="color">빨간</span>색이다. 지금 내가 무슨 말을 하는지 잘 모르겠네?</p>
cs


1
2
3
4
/* CSS */
.color {
  color: red;
}
cs


결과 보기: https://jsfiddle.net/yoonano/zasspkda/


색상에는 red, yellow, blue, green 등의 색상을 사용할 수 있는데요. 세분화된 색상 사용을 원하신다면 이렇게 하셔도 좋습니다. ▼


1
2
// HTML
<p><span class="color">빨간</span>색 글자는 <span class="color">빨간</span>색이다. 지금 내가 무슨 말을 하는지 잘 모르겠네? 이제보니 빨간색도 아니구만!</p>
cs


1
2
3
4
/* CSS */
.color {
  color: #1abc9c;
}
cs


결과 보기: https://jsfiddle.net/yoonano/jupqvhk3/



댓글을 달아 주세요