Reference/HTML
<base> 태그는 문서의 기본 URL을 설정합니다.
<base>
<base> 태그는 문서의 기본 URL을 설정합니다. <head> 요소 안에서만 사용할 수 있으며, 문서에서 한번만 사용할 수 있습니다. <base> 태그가 여러번 사용된 경우 첫 번째 설정만 유지되고 나머지는 무시됩니다.
특징 | 설명 |
---|---|
요소 | 인라인 요소(Inline Element) |
닫는 태그 | 없음 |
버전 | HTML4 |
시각적 표현 | 없음 |
사용성 | ★☆☆☆☆ |
정의(Definition)
- <base> 태그는 문서의 기본 URL을 설정합니다.
- <base> 태그는 문서에서 한 번만 사용하며, <head> 요소 안에서만 사용할 수 있습니다.
- <base> 태그가 여러번 사용된 경우 첫 번째 설정만 유지되고 나머지는 무시됩니다.
문서와 관련된 태그(Document Related Tag)
- <html> 태그는 문서의 최상단 요소를 나타냅니다.
- <head> 태그는 문서 정보에 해당하는 내용을 설정합니다.
- <body> 태그는 문서 본문에 해당하는 내용을 설정합니다.
- <base> 태그는 문서의 기본 URL을 설정합니다.
- <link> 태그는 문서의 외부 리소스를 설정합니다.
- <meta> 태그는 문서의 메타 정보를 설정합니다.
- <style> 태그는 문서의 스타일 정보 설정합니다.
- <title> 태그는 문서의 제목을 설정합니다.
섹션과 관련된 태그(Section Related Tag)
- <main> 태그는 문서의 주요 콘텐츠 섹션을 설정합니다.
- <section> 태그는 주제별 그룹의 콘텐츠 섹션을 설정합니다.
- <article> 태그는 문서의 독립적인 컨텐츠 섹션을 설정합니다.
- <aside> 태그는 주요 콘텐츠의 보조적 컨텐츠 섹션을 설정합니다.
- <header> 태그는 문서의 소개 및 메뉴 그룹 컨텐츠 섹션을 설정합니다.
- <nav> 태그는 문서에 대한 메뉴 링크를 제공하는 섹션을 설정합니다.
- <footer> 태그는 문서 관련 정보 및 관련 링크 콘텐츠 섹션을 설정합니다.
- <address> 태그는 문서 관련 연락처 콘텐츠 섹션을 설정합니다.
- <h1>~<h6> 태그는 각 섹션의 제목을 설정합니다.
속성(Property)
속성 | 값(예) | 설명 | 버전 |
---|---|---|---|
accesskey | accesskey = "a" | 키보드 단축키 힌트를 제공합니다. | - |
autocapitalize | autocapitalize = "off" | 텍스트를 자동으로 대문자로 변환할지 여부를 설정합니다. | - |
contenteditable | contenteditable = "true" | 사용자가 콘텐츠를 편집할 수 있는지 설정합니다. | - |
data-* | data-name = "name" | 사용자가 지정하여 속성을 설정할 수 있습니다. 이 속성은 스크립트를 통해 사용할 수 있습니다. | - |
class | class = "className" | 클래스 이름을 설정합니다. | - |
dir | dir = "rtl" | 요소 글씨의 방향을 설정합니다. | - |
draggable | draggable = "true" | 드래그 사용할 수 있는지 설정합니다. | - |
hidden | hidden | 요소를 숨김 처리할 수 있습니다. hidden 요소는 렌더링하지 않습니다. | - |
id | id = "name" | 고유 식별자 아이디를 설정합니다. CSS나 Script에서 사용합니다. | - |
inputmode | inputmode = "email" | 브라우저가 제공해야 하는 가상 키보드 설정을 알려줍니다 | - |
itemid | itemid = "name" | 아이템 요소의 고유 식별자 아이디를 설정합니다. | - |
itemprop | itemprop = "name" | 아이템 요소의 고유 식별자 속성을 설정합니다. | - |
itemref | itemref = "name" | 아이템 요소의 고유 식별자를 연결합니다. | - |
itemscope | itemscope | 아이템 요소의 범위를 설정합니다. | - |
lang | lang = "ko" | 요소의 언어를 설정합니다. | - |
part | part | 요소의 영역을 파트로 설정합니다. | - |
spellcheck | spellcheck = "true" | 요소의 맞춤법 검사 여부를 설정합니다. | - |
style | style = "margin: 0" | 요소의 적용할 CSS 속성을 설정합니다. | - |
tabindex | tabindex = "0" | 요소의 탭 인덱스를 설정합니다. | - |
title | title = "titleName" | 요소의 타이틀을 설정합니다. | - |
href | href="URL" | 사이트 기본 주소를 설정합니다. | - |
target |
target="_blank" target="_parent" target="_self" target="_top" |
링크 클릭시 새로운 브라우저 창으로 설정합니다. 현재 브라우저의 부모 브라우저 창으로 설정합니다. 현재와 동일한 브라우저 창으로 설정합니다. 최상위 브라우저 창에서 설정합니다. 부모가 없는 경우 _self와 동일합니다. |
- |
예제1(Sample)
기본 문서 샘플 예제입니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<base href="https://webstoryboy.co.kr/"> <!-- 기본 주소 설정 -->
</head>
<body>
<!-- 본문 내용을 작성하는 곳 -->
</body>
</html>
호환성(Compatibility)
6 | 7 | 8 | 9 | 10 | 11 | |||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
<base> | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ | ○ |
댓글