🔮 1. CSS (Cascading Style Sheets)

• 웹 페이지의 레이아웃을 지정하는데 사용하는 언어

• HTML에서 작성한 문서 페이지에 디자인을 입혀줄 때 사용합니다.
  구체적으로 문자 색상 변경, 링크를 버튼으로 보이게 하는 디자인 구성등 다양한 기능 보유

• HTML을 디자인적으로 스타일링 해주는 언어 입니다.

1.1 CSS를 사용하는 이유?

• HTML 만으로 웹 페이지를 제작할 경우 HTML의 요소를 하나하나 정의해야 합니다.
  이러한 작업은 시간이 매우 오래 걸리며, 이런 중복적인 문제를 해결하기 위해서 CSS를
  사용합니다.

• CSS는 W3C에서 만든 스타일시트 언어이며, 웹 페이지에 필요한 디자인(스타일)을
  별도의 파일로 따로 만들어 저장해 사이트의 전체 스타일을 편리하게 관리할 수 있다.

• 여러 개의 문서가 동일한 스타일을 필요할 때, 미리 만들어둔 스타일시트 파일을
  불러오기만 하면, 바로 적용 되므로 일관성 있는 디자인을 유지할 수 있다.

사용 예제

<p>HTML</p>
<p>CSS</p>
<p>JAVA</p>
<p>C #</p>
<p>react</p>

HTML 언어 만으로 작성한 문서가 있습니다. 해당 문서에서 사용하는 모든 폰트의 색상을
빨강색으로 변경해야 할 때, HTML 만을 사용 하게 되면 각 태그마다 일일이 스타일을
지정 해줘야 합니다.

<p style="color:red">HTML</p>
<p style="color:red">CSS</p>
<p style="color:red">JAVA</p>
<p style="color:red">C #</p>
<p style="color:red">react</p>

이렇게 반복되는 중복 동작은 많은 시간이 필요로 합니다. 중복 문제를 해결 하기 위해서
CSS를 사용 해봅시다.

<style>
      p {
        color:red;
      }
  <-- 현재 문서에서 P 태그를 사용하는 모든 폰트의 색상을 빨강색으로 변경 -->
</style>

CSS를 사용하면 중복 작업 없이 손쉽게 문서 페이지의 스타일을 제어할 수 있습니다.

1.2 번외

CSS를 사용하면 웹 페이지를 제작할 때 효과적이고 강력하게 작업을 수행할 수 있습니다.

다만, 콘텐츠 요소에 대한 정보를 부여하는게 아닌, 디자인적 요소만 정의하기 때문에

정보로써의 가치는 떨어지게 됩니다. 그 이유는 만일 시각장애인이 CSS로 꾸며진

웹 페이지를 읽게 된다면, 폰트의 색상이나 콘텐츠의 배치등은 스크린리더기로 확인할 수 없기

때문 입니다. CSS를 사용하지 말아야 한다는 아니지만, 누구나 정보를 쉽게 접근할 수 있게

공공재의 목적을 두고 언어를 적재적소 해야 합니다.