css란?

html로 웹페이지의 구조를 만든다면 css는 꾸며주는 역할을 합니다

css 사용 방법

inline style

html태그 안에 style 속성을 넣어 스타일을 설정하는 방법
inline style은 유지보수가 어렵기 때문에 자주 사용되는 방법은 아님

내부 스타일 시트

html페이지 head 태그 안쪽에 style태그를 활용하여 스타일을 정의 하는 방법
선택자를 활용하여 스타일을 지정함
inline style과 비슷한 이유로 자주 사용되는 방법은 아님(한페이지면 수월하지만 여러페이지면 일관성을 유지하기도 쉽지 않고 불편함)

외부 스타일 시트

외부에 css 파일을 만들어서 link를 걸어 사용하는 방법
head 안쪽에 link 태그를 사용하여 외부에 있는 css파일을 연결하여 사용함
css파일 한개에 여러개의 html 파일을 링크걸어 사용하므로 유지보수가 용이하여 주로 사용되어짐

css 선택자

태그 선택자

태그 선택자는 태그를 선언하여 적용하는 방법이다
태그명 {속성명 : 속성값;}형태로 사용된다
여러 스타일이 적용 될때는 반드시 ;(세미콜론)을 사용하여 한개의 스타일이 끝났음을 표시해야 한다

아이디 선택자

모든 태그에는 고유의 이름을 부여할 수 있습니다. 이때 id라는 속성을 사용합니다
한개의 html 태그에동일한 id를 사용할 수 없습니다
id는 숫자로 시작할 수 없으며 띄어쓰기를 사용할 수 없습니다
css에서 선택자로 사용할 때 #(샵)을 먼저쓰고 아이디명을 적어줍니다
아이디명은 상자의 내용을 유추할 수 있는 이름으로 정하는 것이 좋습니다(아이디명을 정할 때 가이드를 정해줍니다. 협력을 위해서)

클래스 선택자

태그에 그룹명을 부여할 수 있으며 class라는 속성을 사용합니다
id 속성과 다른 점은 여러번 사용할 수 있다는 것입니다
class 명도 숫자로 시작할 수 없으며 띄어쓰기를 사용할 수 없습니다
css에서 선택자로 사용될 때 .(마침표)를 먼저쓰고 클래스명을 적어 줍니다
클래스명은 상자의 내용을 유추할 수 있는 이름으로 정하는 것이 좋습니다

복합 선택자

태그 또는 아이디 또는 클래스의 자식 및 후손 등을 선택하여 적용합니다
후손은 띄어쓰기를 사용합니다
자식은 >(닫는 꺽은 괄호)를 사용합니다