반응형
방법 1
같은 HTML 파일에 HTML 코드와 CSS를 코드를 놓는 방법
1-1. style 태그 사용 (head 태그 안에 있어야 함)
1) html 태그 안에 <style> 태그를 입력하기
<!DOCTYPE html>
<html lang="kr">
<head>
<title>Home - My first website.</title>
<style>
</style>
</head>
<body>
<header>
<h1>The Nick Times</h1>
</header>
<main>
<address>123 Road Altavista</address>
</main>
<footer>© 2024.NN</footer>
</body>
</html>
✅ 방법 2
CSS와 HTML을 분리시키는 방법
1-1. <link href="~.css"rel="stylesheet" /> 태그 사용
1) style.css 파일 만들기
2) link 태그로 연결해주기
<!DOCTYPE html>
<html lang="kr">
<head>
<title>Home - My first website.</title>
<link href="styles.css" rel="stylesheet" />
</head>
<body>
<header>
<h1>The Nick Times</h1>
</header>
<main>
<address>123 Road Altavista</address>
</main>
<footer>© 2024.NN</footer>
</body>
</html>
2번 방법을 더 선호함.
(참고)
<body> </body> 안에는 html 이 들어간다.
반응형
'2. CSS' 카테고리의 다른 글
| CSS 로 텍스트 가운데 정렬 만들기 (text-align) (0) | 2024.11.11 |
|---|---|
| CSS 로 언더라인, 이태릭체(기울림체), 글자 굵기 두께 설정하기 (0) | 2024.11.11 |
| CSS 속성 작성하기 - html 내부에 작성하기 (color, font-size) (0) | 2024.11.11 |
| CSS 작성 방법 (0) | 2024.11.11 |
| CSS 란? (정의) (0) | 2024.11.03 |