플밍장군연구소(이정찬)

CSS(Cascading Style Sheets)를 배우기 앞서서!!

CSS를 들어본 사람도 있고 처음 들어보는 사람도 있을거에요

HTML은 문서의 구조인 내용을 작성하는데 쓰인다면 CSS는 문서의 스타일을 나타낼 수 있어요. 즉 디자인을 꾸미는거죠

그렇다면 문서의 동작은?? 맞습니다. JavaScript가 책임을 지고있습니다.

CSS가 없었다면 여러 사이트들이 딱딱한 문서에 불구했을거에요.

CSS는 전체 페이지 내용이 바뀔 때 관련 있는 요소들은 같이 변경이 돼요 그래서 문서의 일관성을 유지할 수 있다는게

장점인 것 같네요.

CSS로 우선 배경색 지정/글자색 지정/ 디자인/ 박스/ 애니메이션/ UI 등등의 기능이 있어요.

간단하게 CSS의 문법을 봅시다. 구체적인 문법은 뒤에서 배울테니 참고만하세요.

저희가 HTML에서 만들었던 요소를 선택해서 디자인 해야하기 때문에 선택자라는게 있어요.

예를들어 p 등등..

그리고 속성:값 형태로 이루어져있어요 .

p { background-color: yello; } 속성: background-color(배경 색) 값: yello(노란색)

말로하면 이해하시기 힘들테니 예를 들어볼게요.

html에 <p>This is a paragraph.</p>라는게 있다면!! 이 글자에 대해서 꾸미고 싶다!!

그러면 html문서 내 <head> 내부에 <style>...</style>로 해주면 됩니다.

선택자는 우선 p겠죠??

가 되겠죠!!

결과 화면

css를 적용하려면 두 가지 방법이 있어요 . 하나는 html 문서내에 삽입을 시키거나 .css확장자 파일을 만들어서 거기다 적용시키거나

저는 .css 확장 파일을 이용해서 스타일을 지정하는게 훨 효율적이라고 생각해요!!

다음 부터는 css에 대해서 제대로 배워보도록 하죠!! 맛만 보기였답니다.

CSS란?