고정 헤더 영역
상세 컨텐츠
본문
지난 포스팅에서 css를 그냥 하나의 html 파일에 넣어놨다.
https://marketerbong.tistory.com/40
방법은 간단하다.
1. html 파일 만들었던 폴더에 style.css 파일을 만든다.
파일명은 style 이 아닌, 어떤 걸로 해도 상관은 없다. 확장자만 ~.css로 하면 된다.
2. <style>~</style> 안에 있던 모든 소스를 생성한 css 파일에 넣어놓는다.
위 이미지 표시한 영역을 css파일에 복붙한다.
3. <style> 부분을 삭제하고, <head>영역에 아래 스크립트를 삽입한다.
<!-- style.css 파일을 같은 폴더에 만들고, head 태그에서 불러오기 -->
<link rel="stylesheet" type="text/css" href = "(css파일이름).css">
나는 css파일 이름을 기억하기 쉽게 style이라 했지만, 무엇으로 해도 상관없다.
다만 파일명을 바꿨으면 [파일명.css]로 삽입해야한다.
** 참고로 html 파일 마다 css 파일을 다르게 지정할 수 있다. html은 하나의 페이지인 셈이니까, 다른 페이지로 넘어가면 다른 html파일이 열린 것과 같다. 그렇기에 css파일을 페이지마다 다르게 설정한다면, 모든 페이지가 다른 디자인이 나올 수도 있다. (굳이 그럴 필요는 없지만, 프로모션 페이지를 별도로 만들거나, 콘텐츠 존을 따로 구성한다거나 할 때 사용할 수 있다.
'7. 봉드로이드_개발공부' 카테고리의 다른 글
| 특정 영역 불투명도 조절하는 방법(linear-gradient) (0) | 2024.10.04 |
|---|---|
| 부트스트랩 사용 방법(사이트 손 쉽게 꾸미기) (0) | 2024.10.04 |
| 사이트에 내가 원하는 폰트 적용하는 방법(ft.구글 웹 폰트) (0) | 2024.10.03 |
| html, css, javascript 이게 뭔가요? (8) | 2024.10.02 |
| VS CODE 설치하기 (2) | 2024.10.02 |
