HTML 이란
웹문서 구조를 표현하는 마크업 언어인 HTML (HyperText Markup Language)
프론트엔드 개발 입문자라면 반드시 배우는 HTML!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>문서 제목</title>
</head>
<body>
<h1>Hello World!</h1>
<p>이것은 간단한 HTML 문서입니다.</p>
</body>
</html>Hello World!
이것은 간단한 HTML 문서입니다.
<body> </body> 사이에 있는 내용들이 브라우저에 표기된다.
HTML 문서는 크게 <head> 와 <body> 로 구분하며,
<head> 는 웹 문서에 필요한 설정,
<body> 는 실제로 사용자에게 보여지는 부분이라고 이해하면 된다. 그럼 간단히 실습해보자!
텍스트에 하이퍼링크 연결하기
제목 헤드라인에 하이퍼링크 연결하는 방법에 대해서 알아보자.
텍스트 또는 이미지를 a 요소 안에 감싸고,
웹 주소를 포함하는 href 속성 (Hypertext Reference or target)을 사용하여 만들어 보자.
<a href="https://ozcodingschool.com/">
<h1>오늘의 할 일</h1>
</a>리스트 나열하기
리스트 나열하기 2가지 종류가 있는데,
1) 순서가 없는 리스트 (Unordered List)
2) 순서가 있는 리스트 (Ordered List) 를 만들어 보자.
먼저, 순서가 없는 리스트 만들기.
<ul>
<li>HTML 예습하기</li>
<li>MDN 사이트 접속하기</li>
<li>w3school 사이트 접속하기</li>
<li>실습 도전하기</li>
</ul>다음, 순서가 있는 리스트 만들기.
<ol>
<li>첫 번째</li>
<li>두 번째</li>
<li>세 번째</li>
</ol>완성본은 이렇게 보여진다.
오늘 공부한 내용 응용하여 앞으로 많이 참고할 사이트 공유하기!
<body>
<ul>
<li>
<a href="https://developer.mozilla.org/ko/docs/conflicting/Learn_web_development/Core/Structuring_content">
<h3>MDN</h3>
</a>
</li>
<li>
<a href="https://www.w3schools.com/html/default.asp">
<h3>W3school</h3>
</a>
</li>
</ul>
</body>#오즈코딩 #베이스캠프
It's about how hard you can get hit and keep moving forward.