CSS3
공부한 곳
- TCPSCHOOL.com
공부 내용
CSS3
CSS란 Cascading Style Sheets의 약자
CSS는 HTML 요소들이 화면에서 어떻게 보이는가를 정의하는 데 사용되는 스타일 시트 언어
CSS 적용 방법
- 인라인 스타일
- 내부 스타일 시트
- 외부 스타일 시트
1. 인라인 스타일
HTML 요소 내부에 style 속성을 사용하여 CSS 스타일을 적용하는 방법
해당 요소에만 스타일이 적용됨.
<p style="color:green; text-decoration:underline">
인라인 스타일을 이용하여 스타일을 적용하였습니다.
</p>
2. 내부 스타일 시트
내부 스타일 시트를 이용한 방법은 HTML 문서의 태그 내에 <style> 태그를 사용하여 스타일을 지정
해당 HTML 문서에만 스타일이 적용됨.
<style>
body { background-color: lightyellow; }
p { color: red; text-decoration: underline; }
</style>
3. 외부 스타일 시트
웹 사이트 전체의 스타일을 하나의 파일에서 변경할 수 있도록 해줌.
스타일을 적용할 모든 웹 페이지의 태그 내에 태그를 사용하여 외부 스타일 시트를 포함시킴
3.1 HTML 문서에서
<link rel="stylesheet" href="/examples/media/expand_style.css">
3.2 CSS 파일
body { background-color: lightyellow; }
p { color: red; text-decoration: underline; }
스타일 적용의 우선순위
1. 인라인 스타일
2. 내부 / 외부 스타일 시트
3. 웹 브라우저 기본 스타일
728x90
'# FE > HTML5, CSS3' 카테고리의 다른 글
[CSS3] margin 속성 한 번에 기재할 때 순서 (0) | 2020.04.13 |
---|---|
CSS 선택자 (0) | 2020.04.08 |
CSS 기본 속성 (0) | 2020.04.01 |
ID, Class, Name 속성 비교하기 (0) | 2020.03.26 |
HTML5 30분 기초 완성 2편 (0) | 2020.03.24 |
HTML5 30분 기초 완성 1편 (0) | 2020.03.24 |
Visual Studio Code Extension (플러그인) (0) | 2020.03.09 |