Website/HTML

Tag Attributes

MoZZANG 2022. 2. 5. 11:32

tag는 우리가 browser에게 content의 종류와 위치 등을 알려주는 역할을 한다.

 

tag만 있다면 그것이 끝이다.

 

하지만 Attribute(속성)과 함께라면 더욱 엄청난 힘을 갖게 된다.

 

Attribute(속성)은 tag의 <> 안에 넣으므로써 추가적인 기능들을 제공하게 된다.'

 

아래의 예시를 보자

 

tag <a></a>는 정말정말 중요한 tag중 하나인데 우리말로 닻을 뜻하는 영어 'anchor'에서 가져온것이라 한다.

 

이 <a></a> tag는 설정해놓은 다른 페이지로 가는 기능인 링크(link)를 수행하는 tag이므로 꼭 알고 있어야한다.

 

아무튼 위 처럼만 입력한다면 결과물은 다음과 같다.

▲ text는 출력되었지만 링크(link)의 기능은 없는 상태이다. Why?

 

▼ link 기능을 가지려면 다음과 같이 입력해주어야 한다.

<a> tag안에 href(=hypertext reference = 뒤에것을 참조하라)를 사용하여 원하는 링크를 걸어주어야 한다.

 

위의 예시처럼 href="" 을 우리는 attribute(속성)이라고 한다.

 

즉 attribute(속성)은 tag 안에 작성하여 특정기능을 수행하는 기능들을 말하는 것이다.

 

 

 

이러한 attribute은 tag만큼 종류가 다양하기 때문에 절~대 외울려고 하지말고 필요하면 찾아보고

또 사용하면서 자연스럽게 외워지는 방향으로 사용하는 것이 좋다.

attribute의 사용방법은 정해져있고 단순하기 때문에 사용방법만 숙지한다면 누구나 찾아서 사용할 수 있다.

 

또한 attribute(속성)중에는 모든 tag에서 사용할 수 있는 것들이 있고, 특정 tag안에서만 작동하는 것들이 있다.

 

예를 들면, id=""는 모든 tag에서 사용할 수 있는 Global attribute이고 

              src=""(source의 약자)는 <audio>,<embed>,<img>,<input>등 특정 tag에서만 사용할 수 있다.

 

 

 

 

이처럼 단순히 tag만 가지고 할 수 있는 것들은 단순하고 제한적이지만, attribute이라는 단짝과 함께한다면

훨씬 더 강력한 기능들을 구현할 수 있다는 것을 알고 attribute도 조금은 공부하자.

'Website > HTML' 카테고리의 다른 글

Semantic HTML  (0) 2022.02.08
block형과 inline형 tag  (0) 2022.02.05
HTML 태그를 찾는 방법  (0) 2022.02.04
HTML Tag  (0) 2022.02.04
HTML의 가장 기본이 되는 뼈대  (0) 2022.02.03