CSS란?
cascading style sheet 의 약자로, 마크업을 도와주는 언어라고 할 수 있다. html으로 뼈대를 잡았다면 css로 웹페이지를 예쁘게 꾸며준다.
cascading은 폭포라는 뜻으로, 위에서 아래로 기능이 적용된다는 뜻에서 붙여진 이름이다.
💡CSS구조
- 선택자 : 꾸미고 싶은 html 요소를 선택 예)
h1,p - 속성명 : 꾸미고 싶은 속성명을 입력 예)
color,background - 속성값 : 어떻게 꾸밀지 입력 예)
blue
💡CSS 적용 방법
- 인라인 스타일 - Inline Style Sheet
HTML 태그의 style 속성에 속성명과 값을 작성한다.
꼭 사용해야 하는 경우를 제외하고는 사용하지 않는다. - 내부 스타일 - Internal Style Sheet
<head>태그 안에<style>태그를 사용하여 정의한다.
많은 페이지에 동일한 스타일 규칙을 적용시키기 위해서는 모든 페이지마다 style태그를 복붙해야 함. 용량도 커지고 불편해서 외부스타일을 활용함. - 외부 스타일 - External Style Sheet
CSS파일을 외부에 정의해놓고, 외부에 정의한 CSS를 HTML파일에 연결하여 사용하는 것을 말한다.
<link>태그로 연결하며 head 태그 내에 선언해야 한다.
💡CSS출처
- author style - 제작자가 작성한 스타일 시트. 예)
.css 파일
⬇️ - user style - 사용자가 설정하는 스타일. 예)
다크모드 설정,글씨 크기...
⬇️ - browser - 브라우저에서 기본으로 제공하는 스타일
css출처 적용 우선순위
사용자 !important > 제작자 !important > 제작자 > 사용자 > 브라우저
기록하는 습관을 기르고 있습니다.