복습하기
See the Pen Untitled by jangjia01234 (@jangjia01234) on CodePen.
CSS 적용법
1) 같은 html 파일에 html 코드와 css 코드를 놓는 방법
- style 태그는 반드시 'head' 안에 들어가 있어야 한다. (header와 혼동 x)
- style 태그 뒤에 사용하고자 하는 태그를 지정하고(ex.h2), 원하는 속성값을 쓰면 된다. (ex. color:~ font-style:~)
2) css와 html을 분리하는 방법 (*추천!)
- css 파일을 따로 만들고, link 태그를 이용해서 이 파일을 연결한다
- 이때 href 다음에 오는 것은 파일명이며, rel은 relationship 즉 (해당 파일과의) 관계를 뜻한다
<head>
<link href="styles.css" rel="stylesheet" />
</head>
CSS의 역할과 Selector
css가 하는 일은 html 태그를 가리키는 일이며,
이때 이 가리키는 것을 'selector'이라고 부른다. selector는 아래와 같이 작성한다.
꼭 중괄호를 사용해야 하는 점 주의!
selector {
we write whatever we want
}
작성시 주의사항 / etc
1. 태그 작성시 띄어쓰기 X
css에서 태그를 쓸 때는 띄어쓰기가 없도록 주의해야 한다.
ex) font size(x) font-size(o)
2. CSS = Cascading Style Sheets
cascading은 위에서 아래로 내려오는.. 그런 뜻인데
여기서 꼭 기억해야 할 점은, CSS는 마지막에 작성한 내용만을 받아들인다.
(ex. 중복되는 내용을 여러 번 적을 경우 마지막에 기록된 내용이 반영됨)
따라서, 코드의 순서가 결과에 영향을 미친다는 점 주의하기!
'Web > HTML, CSS' 카테고리의 다른 글
[CSS] Combinators, Attribute, Colors and Variables (0) | 2022.07.11 |
---|---|
[CSS] fixed ~ pseudo selectors (0) | 2022.07.08 |
[CSS] Inlines ~ Flexbox 복습 (0) | 2022.07.06 |
[HTML] 기본적인 내용 복습차 클론코딩 (0) | 2022.07.04 |
[HTML] Learning about Tags (0) | 2022.06.27 |