반응형
1. <q> 태그 - 인용 내용 표시하기
기본형 : <q> 인용 내용</q>
- 인용 내용을 표시하기 위해 <q> 태그를 사용할 수 있습니다. <q> 태그가 <blockquote> 태그와 다른 점은 <blockquote> 태그는 인용 내용이
줄이 바뀌어 나타나고, 다른 내용과 구분이 되도록 들여쓰기 기능이 적용되지만 <q> 태그는 인라인 레벨 태그이기 때문에 줄바꿈 없이 다른
내용과 함께 한 줄로 표시되고 인용 내용을 구분할 수 있도록 따옴표를 붙어 표시합니다.
간단한 <q> 태그 예제를 작성해보겠습니다. 웹의 창시자인 팀 버너스리를 위키 백과에서 검색 한 결과입니다.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18 |
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title><q> 태그 사용</title>
</head>
<body>
<h1>팀 버너스리</h1>
<q>1989년 월드 와이드 웹의 하이퍼텍스트 시스템을 고안하여 개발했다.
인터넷의 기반을 닦은 여러 공로로 웹의 아버지라고 불리는 인물 중 하나이다.
URL, HTTP, HTML 최초 설계도 그가 한 것이다.</q>
<blockquote>1989년 월드 와이드 웹의 하이퍼텍스트 시스템을 고안하여 개발했다.
인터넷의 기반을 닦은 여러 공로로 웹의 아버지라고 불리는 인물 중 하나이다.
URL, HTTP, HTML 최초 설계도 그가 한 것이다.</blockquote>
</body>
</html> |
cs |
<사진 1.1>
<사진 1.1>은 <q> 태그와 <blockquote> 태그의 차이점을 알아보기 위해 같은 내용의 문장을 <q> 태그와 <blcokquote> 태그를 사용하여 작성했습니다.
<사진 1.1 결과 화면>
보시다시피 <q> 태그를 사용한 내용은 줄바꿈이 없고, 큰 따옴표("")가 자동으로 문장의 끝과 처음에 삽입이 되었습니다.
아래 문장 즉, <blockquote> 태그는 인용 내용이 줄이 바뀌어 적용이 되고 들여쓰기 기능이 적용되었습니다.
반응형
'Web Basic > HTML5' 카테고리의 다른 글
| [HTML5] <span> 태그 사용 방법 (0) | 2018.03.11 |
|---|---|
| [HTML5] <mark>태그 사용 방법 (0) | 2018.03.11 |
| [HTML5] <strong>태그, <b>태그 사용 방법 (0) | 2018.03.08 |
| [HTML5] <pre>태그 사용 방법 (0) | 2018.03.07 |
| [HTML5] <blockquote>태그 사용 방법 (0) | 2018.03.07 |