안녕하세요. 플입니다.
css 선언 방법 중 최우선 적용되는 방법은 어떤 방법일까요?
1. inline
<p style="color:blue;"> </p>inline 방법은 html에서 태그에 직접 style을 입력하는 방법이에요.
태그에 직접적으로 입력해서 가장 최우선으로 적용돼요.
다만 유지보수가 힘들어서 권장하는 방법은 아니에요.
html 코드가 길어지면 style 하나를 고치기 위해 엄청 긴 코드를 일일이 뒤져야 할 테니까요.
2. intermal
<head>
<style>
p{ color:red; }
</style>
</head>inline보다 유지보수가 수월한 internal 방법이에요.
<head> 태그 안쪽에 <style> 태그를 만들어서 그 안에서 css를 선언해줘요.
<head> 태그 안쪽에서 살펴볼 수 있기 때문에
inline방법보다는 유지보수가 간편하지만 여전히 html문서 안에 쓰기 때문에
용량 문제도 있고, html문서가 여러 개면 동일한 style적용도 새로 적어야 하는 문제가 발생하겠죠.
3. external
<head>
<line rel="stylesheet" href="style.css">
</head>p{ color:yellow; }
external 방식은 가장 권장하는 방식이에요.
<head> 태그에 css파일을 연결해서 불러오는 방식이라
html 문서에서 style을 작성할 필요가 없어요.
css 파일을 새로 만들어서 필요한 html문서에 연결만 해주면 된답니다.
유지보수가 간편해서 권장하는 방법이에요.
하지만 inline이나 internal 방식이 중복 적용되어있다면
inline > internal > external 순서대로 우선 적용되어서
external 방식으로 처리된 style은 적용이 안될 수 있어요.
예시로 든 태그를 모두 입력했다면,
inline으로 선언한 color:blue;가 적용되겠죠.
그래서 화면에는 파란 글씨가 나올 것입니다.
그럼 이만.
총총.
'coding > html + css' 카테고리의 다른 글
| [css] 배경색 반반 무많이 (6) | 2020.04.14 |
|---|---|
| [html] figure 활용하기 (0) | 2020.03.27 |
| [html] id / class 구분 (0) | 2020.02.12 |
| [html] 의미 없는 문장 채우기 (0) | 2020.02.10 |
| [css] z-index (6) | 2020.01.02 |
