웹/CSS
CSS의 형식 - HTML의 스타일과 스타일 시트 (HTML 꾸미기)
Judith Hopps
2022. 8. 29. 13:59
반응형
이번엔 HTML 문서를 꾸미는 방법에 대해 알아보려고 합니다.
CSS를 사용하는 이유, 목적
웹의 스타일(글꼴, 색상, 정렬 등)을 결정하기 위해 CSS를 사용합니다.
웹 문서의 내용과 상관없이 디자인을 설정할 수 있습니다.
기기에 맞게 탄력적으로 문서를 만들 수 있습니다.
CSS의 형식
<style> 태그 후 선택자와 중괄호({}) 안에 스타일 속성과 속성값을 적어줍니다.
주석은 /* */를 사용합니다.
스타일 규칙은 세미콜론(;)으로 구분합니다.
가시성을 위해 여러 줄에 작성하는 경우가 많습니다.
외부 스타일 시트
스타일 규칙이 많을 경우 또는 같은 규칙을 여러번 사용할 경우 사용합니다.
css 규칙들을 하나의 파일에 작성한 후 확장자를 css로 저장합니다.
html의 <head> 태그 안에 <link href="시트명.css" rel="stylesheet" type="text/css"> 문구를 추가합니다.
선택자
전체 선택자 : *
태그 선택자 : 태그
클래스 선택자 : .클래스명 (태그 뒤에 class="클래스명"을 추가로 기입합니다.)
클래스 선택자 : → 여러번 반복 가능
id 선택자 : #아이디명 (태그 뒤에 id="아이디명"을 추가로 기입합니다.)
클래스 선택자 : → 문서 내 한번만 적용
그룹 선택자 : 선택자,선택자
반응형