공백.

무엇이든 적고, 기록하고 기억하는

성장일기/Web

[FE] 새싹에서 나무까지 - HTML 전역속성

Blank_D 2022. 1. 24. 23:38

개요

HTML의 전역속성에 대해 소개한다.

들어가며

HTML 에서 이야기는 '속성' 이라는 개념을 한번 설명하고 글을 읽기를 추천한다.

속성이란?

열리는 태그에 작성하는 HTML 의 기능을 확장해 주는 기능을 의미한다.
즉 href , target, src 등 태그 안에 사용하는 속성(attribute)을 뜻하는데 사용방법은 아래 예시와 같다.
예시) <a **href**="www.naver.com" **target**="_blank">네이버이동</a>
풀이 = a라는 태그의 네이이버 이동을 할건데, 링크(href)는? www.naver.com 이고, 페이지를 이동할 때는 새로운 창(targer="_balnk")으로 열릴거야 라는 조건을 추가하여 동작시키는 것을 의미한다.
-
이와같이 <a> 라는 태그의 기능을 더하여 주는 것이다.
-
각 요소들은 자신이 사용할 수 있는 속성이 정해져 있다
<img href="?"> 이미지 태그에 href 속성을 사용할 수 있을까?
없다. src도 링크고 href도 링크이지만, img 에서는 href 속성을 사용할 수 없다.

전역속성이란?

전체의 영역에서 모두 사용할 수 있는 속성이다.
대표적인 속성 : <title> <style> <class> <id> <data>

  • <title> : 해당하는 요소의 설명을 명시하는 전체영역에서 쓸 수있는 HTML 속성이다.
  • <style> : link 를 이용하여, css 파일과 연동시킬 수도 있고, HTML에서 전역속성을 이용하여 바로 적용할 수도 있다.
  • <class> : 요소를 지칭하는 이름이며, 특징은 중복 가능한 이름을 지을 수 있다는 것이다.
  • <id> : 클래스와 동일하게 요소를 지칭하는 이름이지만, 고유한 이름이다. 자주 사용하지 않지만 중요한 위치에 해당 속성을 사용하는 것을 선호한다.
  • <data> : 요소에 데이터(텍스트)를 지정하는 것을 의미하며, 태그 내에 해당 데이터를 저장하는 것을 의미하며 JS 와의 연동에서 자주 사용한다.