2024. 4. 6. 18:00ㆍ코딩 도구/웹 소프트웨어
PART 4
HTML ELEMENTS
❖ HTML을 사용하여 간단한 웹 페이지를 구축하는 기본 요소는 다음과 같습니다
제목 만들기, 그림 삽입, 목록 만들기, 표 만들기, 텍스트 삽입, 하이퍼링크 만들기
❖<h1> to <h6> tags
▪ 제목에만 HTML 제목 사용
• 제목을 사용하여 텍스트를 크게 또는 굵게 만들지 않음
❖<p> 태그
▪ 단락을 정의합니다
▪ 문단 앞과 뒤에 빈 줄이 추가됩니다
▪ end 태그를 잊지 마세요.
▪ HTML 코드에서 Enter 키를 눌러 줄을 변경해도 웹 브라우저에서 줄이 변경되지 않습니다.
❖ <br> 태그
▪ 줄 바꿈을 정의합니다
• 새 단락을 시작하지 않고 줄 바꿈을 원하는 경우 사용합니다:
<body>
<h1>Heading 1</h1>
<p>
My Bonnie lies over the ocean. <br>
My Bonnie lies over the sea. <br>
My Bonnie lies over the ocean. <br>
Oh, bring back my Bonnie to me. <br>
</p>
</body>
<hr> 태그
▪ 수평선을 정의합니다
• HTML 페이지에서 내용을 구분(또는 변경을 정의)하는 데 사용됩니다
<!DOCTYPE html>
<html>
<head>
<title>My paragraph</title>
</head>
<body>
<h1>Heading 1</h1>
<hr>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>
❖ Text formatting elements
<!DOCTYPE html>
<html>
<head>
<title>My paragraph</title>
</head>
<body>
<p><sub>subscript</sub> and <sup>superscript</sup></p>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><i>This text is italic</i></p>
<p><em>This text is emphasized</em></p>
<p><code>This text is code</code></p>
</body>
</html>
❖HTML Quotations
태그 설명
<abbr> 약어 또는 약어를 정의합니다
<address> 문서의 작성자/소유자 연락처를 정의합니다
<bdo> 텍스트 방향을 정의합니다
<block quote> 다른 출처에서 인용된 섹션을 정의합니다
<cite> 작품의 제목을 정의합니다
<q> 짧은 인라인 따옴표를 정의합니다
<!DOCTYPE html>
<html>
<head>
<title>My paragraph</title>
</head>
<body>
<p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p>
<p><bdo dir="rtl">This paragraph will go right-to-left.</bdo></p>
<p>HTML's goal is to: <q>Build a structure of the website.</q>Study hard.</p>
</body>
</html>
❖ Special characters
❖HTML comments are not displayed in the browser
❖Syntax
<!--<p> 아무 내용!!!~~~</p> -->
❖Used to list iteams
▪ Unordered list <ul>
- ordered list <ol>
❖ <a> tag
▪ Example of hyperlink
<!DOCTYPE html>
<html>
<head>
<title>My paragraph</title>
</head>
<body>
<h1>Heading 1</h1>
<p>This is a paragraph.</p>
<a href="http://www.google.com">Google</a>
</body>
</html>
'코딩 도구 > 웹 소프트웨어' 카테고리의 다른 글
| HTML Basics - PART 3 HTML 기본 정리 (1) | 2024.04.06 |
|---|---|
| HTML Basics - Part 2 WEB DEVELOPMENT TECHNIQUES (1) | 2024.04.06 |
| HTML Basics - PART 1 THE INTERNET AND WWW (1) | 2024.04.06 |
| React 초기 설정 시 여러 오류 해결 및 궁금증 해결 (1) | 2024.04.06 |
| (코딩애플님 유튜브 영상 정리) React 기초 1강 : 리액트 설치와 셋팅법 (1) | 2024.04.05 |