티스토리 뷰
반응형
✏️ 제목을 나타내는 <hn> 태그
<h1> 내용 </h1>
//웹 문서에서 제목을 나타내는 태그로서 종류는 <h1> ~ <h6> 태그까지 있으며
//숫자가 작아질수록 글자의 크기가 작아지며 자동으로 줄바꿈을 해줌
✏️ 텍스트 단락을 나타내는 <p> 태그
<p> 내용 </p>
// <p>와 </p>태그 사이에 텍스트를 입력하면 텍스트 앞뒤로 줄바꿈이 생김
// 편집기에서 줄바꿈을 시도하더라도 웹사이트상에서는 변함이 없음
✏️ 줄바꿈을 해주는 <br> 태그
<p> 안녕하세요 <br> 잘 부탁드립니다</p>
// <br>태그는 줄을 바꿔주고 다른 태그들과는 달리 닫는 태그가 없음
// <br>태그를 두 번 사용하면 빈 줄이 생기면서 텍스트 단락이 생긴 것처럼 화면에 표시할 수 있지만
// 실제로는 단락이 만들어진 것이 아님 => <p>태그를 사용해서 텍스트 단락을 만들기
✏️ 인용할 때 쓰는 <blockquote> 태그
<blockquote> 인용문 </blockquote>
/*
일반적으로 남의 말을 인용할 때는 ""큰 따옴표를 사용해 표시하지만 웹 브라우저에서는 인용문을 인식할 방법이 없음
브라우저가 인용문을 인식하게 하기 위해서는 <blockquote> 태그를 사용해야 함
*/
✏️ 텍스트를 굵게 표시해주는 <strong>, <b> 태그
<strong> 굵게 강조할 텍스트 </strong>
<b> 굵게 표시할 테스트 </b>
// 둘이 표면적으로는 별 차이가 없지만 구분하는 이유는 화면 낭독기의 기능 차이
// 경고나 주의사항처럼 중요한 내용들은 <strong> 태그로, 키워드처럼 단순한 글자만 굵게 표시할 때는 <b> 태그를 사용
// 즉, 보이는 것이 아니라 의미 중심으로 나뉜다
✏️ 기울인 텍스트를 입력해주는 <em>, <i>태그
<em> 이탤릭체로 강조할 텍스트 </em>
<i> 이탤릭체로 표시할 텍스트 </i>
//텍스트를 기울여 표시할 때 사용하는 태그들
// <em> 태그는 문장에서 흐름상 특정 부분을 강조하고 싶을 때 사용
// <i> 태그는 마음속의 생각이나 용어, 관용구 등에 사용
✏️ 다양한 텍스트 관련 태그
//<abbr> 태그 : 줄임말을 표시하고 title속성을 함께 사용할 수 있음
<abbr title = "Internet of Things"> IOT </abbr>
//<cite> 태그 : 웹 문서나 표스트에서 참고 내용을 표시
<p>내가 경험한 가장 흥미지진진한 일은 누군가를 만나는 일이다 - 영화, <cite>'비포선셋'</cite>중</p>
//<code> 태그 : 컴퓨터 인식을 위한 소스 코드
<code> function savetheLocal()</code>
//<small> 태그 : 부가 정보처럼 작게 표시해도 되는 텍스트를 사용할 때
<p>가격 : 13,000원 <small>(부가세 별도)</small></p>
//<sub> 태그 : 아래 첨자를 표시하는 태그
<p>물의 화학식은 H<sub>2</sub>0입니다</p>
//<sup> 태그 : 윗 첨자를 표시하는 태그
<p>E=mc<sup>2</sup></p>
//<s> 태그 : 취소선을 표시하는 태그
<p><s>34,000원</s>19,000원</p>
//<u> 태그 : 밑줄을 표시하는 태그
<u>텍스트에 단순히 밑줄 긋기</u>
//<ins> 태그 : 공동 작업 문서에서 새로운 내용을 삽입하는 태그
<ins>새로운 내용을 삽입합니다.</ins>
//<del> 태그 : 공동 작업 문서에서 기존 내용을 삭제하는 태그
<del>기존 내용을 삭제합니다.</del>
반응형
'Front-end > HTML' 카테고리의 다른 글
[Web/HTML] HTML - 오디오와 비디오 삽입하기 (0) | 2024.04.15 |
---|---|
[Web/HTML] HTML - 이미지 삽입하기 (0) | 2024.04.15 |
[Web/HTML] HTML - 표 만들기 (0) | 2024.04.14 |
[Web/HTML] HTML - 목록 만들기 (0) | 2024.04.14 |
[Web/HTML] HTML 소개 및 기본 (0) | 2024.04.14 |
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
링크
TAG
- C++ Stack
- html
- js
- DFS
- 스택
- 자바
- 세그먼트 트리
- 반복문
- 투 포인터
- DP
- C++
- 알고리즘
- 백준
- 자료구조
- 자바스크립트
- 우선순위 큐
- 백준 풀이
- 유클리드 호제법
- 스프링 부트 crud 게시판 구현
- BFS
- 이분 매칭
- 카운팅 정렬
- 에라토스테네스의 체
- java
- CSS
- Do it!
- HTML5
- 알고리즘 공부
- c++ string
- 유니온 파인드
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
글 보관함