HTML (HTML5)
HTML은 하이퍼 텍스트 마크업 언어로, 웹 페이지 표시를 위해 개발된 지배적인 마크업 언어이다.
✒️ 공부하면서 한 번씩 더 기억할 만한 내용들 위주로 적어보고자 한다.
📍 기본 구성
HTML 문서는 가장 기본적으로 아래와 같은 뼈대를 갖는다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"> <!-- 한글 깨짐 방지 -->
<title></title>
<style></style>
</head>
<body>
</body>
</html><!DOCTYPE html>로 html 문서임을 명시하고, <meta charset="UTF-8">로 한글 깨짐을 방지한다.
이후, 내부 CSS는 <head>의 <style>안에, 눈에 보여지는 본문은 <body>에 작성하게 된다.
💡 기본 항목을 손으로 직접 타이핑하는 방법도 있지만, vscode에서는 아래의 방법으로 보다 편하고 정확하게 작성할 수 있다.
- 빈 문서에
!를 입력하여 자동 완성- 빈 문서에
html을 입력 후,html:5선택하여 자동 완성
📍 Text Tag
개행을 시키는 태그 : br<br><br>
<em>글자를 기울이는 태그 : em</em><br>
<mark>형광펜 효과를 나타내는 태그 : mark</mark><br>
<u>글자에 밑줄을 긋는 태그 : u</u><br>
<s>글자에 취소선을 넣는 태그 : s</s><br>
<sub>아래첨자 만드는 태그 : sub</sub><br>
<sup>윗첨자 만드는 태그 : sup</sup><br>
<small>글자를 작게 만드는 태그 : small</small><br>이외에도 <h1>, <h2>, … <pre>, <hr>와 같은 다양한 태그들을 <body>에 적어 text를 꾸밀 수 있다.
<!-- 음성에서의 차이가 존재한다.
strong : 굵음 + 강하게 읽음 / b : 굵게 보이기만 함. -->
<strong>글자를 굵게 표시하는 태그 : strong</strong><br>
<b>글자를 굵게 표시하는 태그 : b</b><br><br><strong>과 <b> 태그는 글자를 굵게 표시하는 동일한 효과를 지니고 있지만, 음성에서의 차이가 존재한다. <strong>은 단순히 보여지는 강조뿐만 아니라 강한 어조로 낭독해 주어 웹 접근성에 큰 기여를 한다.
