HTML 태그에 속성을 추가하는 방법

HTML 언어 는 많은 요소를 포함합니다. 여기에는 단락, 제목, 링크 및 이미지와 같이 일반적으로 사용되는 웹 사이트 구성 요소가 포함됩니다. 헤더, 탐색, 꼬리말 등을 포함하여 HTML5에서 소개 된 여러 가지 새로운 요소가 있습니다. 이러한 HTML 요소는 모두 문서의 구조를 만들고 의미를 부여하는 데 사용됩니다. 요소에 더 많은 의미를 추가하려면 속성을 부여 할 수 있습니다.

기본 HTML 열기 태그는 <문자로 시작합니다. 그 다음에 태그 이름이오고 마지막으로> 문자로 태그를 완성합니다. 예를 들어, 시작 단락 태그는 다음과 같이 작성됩니다.

HTML 태그에 속성을 추가하려면 먼저 태그 이름 뒤에 공백을 넣습니다 (이 경우 "p"입니다). 그런 다음 사용할 속성 이름 뒤에 등호를 추가하십시오. 마지막으로 속성 값은 따옴표로 묶입니다. 예 :

태그는 여러 속성을 가질 수 있습니다. 공백을 사용하여 각 속성을 다른 속성과 구분합니다.

필수 속성이있는 요소

일부 HTML 요소는 의도 한대로 작동하게하려면 실제로 속성이 필요합니다. image 요소와 link 요소는이 두 가지 예입니다.

image 요소에는 "src"속성이 필요합니다. 이 속성은 해당 위치에서 사용하려는 이미지를 브라우저에 알려줍니다. 속성의 값은 이미지에 대한 파일 경로가됩니다. 예 :

이 요소에 또 다른 속성, "alt"또는 대체 텍스트 속성이 추가되었음을 알 수 있습니다. 기술적으로 이미지의 필수 속성은 아니지만 액세스 가능성을 높이기 위해 항상이 내용을 포함하는 것이 좋습니다. alt 속성의 값에 나열된 텍스트 는 이미지가 어떤 이유로 로드되지 않을 표시됩니다.

특정 속성을 필요로하는 또 다른 요소는 앵커 또는 링크 태그입니다. 이 요소에는 '하이퍼 텍스트 참조'를 나타내는 'href'속성이 포함되어야합니다.이 링크는 "이 링크가 있어야하는 위치"라는 멋진 표현입니다. 이미지 요소가로드 할 이미지를 알아야하는 것처럼 링크 태그는 링크 태그가 어떻게 보일지는 다음과 같습니다.

>

이 링크를 사용하면 특성 값으로 지정된 웹 사이트로 사람을 데려 갈 수 있습니다. 이 경우, 그것의 메인 페이지입니다.

CSS 후크로서의 속성

속성의 또 다른 용도는 CSS 스타일의 "후크"로 사용될 때입니다. 웹 표준은 페이지의 구조 (HTML)를 스타일 (CSS)과 별도로 유지해야한다고 규정하고 있으므로 CSS에서 이러한 속성 후크를 사용하여 구조화 된 페이지를 웹 브라우저에 표시하는 방법을 결정합니다. 예를 들어 HTML 문서에서이 마크 업을 사용할 수 있습니다.

해당 부분이 배경색이 검정색 (# 000)이고 글꼴 크기가 1.5em 인 경우 CSS에이 부분을 추가합니다.

.featured {background-color : # 000; font-size : 1.5em;}

"추천"클래스 속성은 CSS에서 해당 영역에 스타일을 적용하기 위해 사용하는 후크 역할을합니다. 우리가 원하는 경우 여기에 ID 속성을 추가 할 수도 있습니다. 클래스와 ID는 모두 보편적 인 속성이므로 어떤 요소에도 추가 할 수 있습니다. 또한 특정 CSS 스타일을 대상으로하여 해당 요소의 시각적 모양을 결정할 수도 있습니다.

Javascript에 관해서

마지막으로 특정 HTML 요소에 속성을 사용하는 것도 Javascript에서 사용할 수 있습니다. 특정 ID 속성을 가진 요소를 찾고있는 스크립트가있는 경우, 이는 HTML 언어의이 공통 부분의 또 다른 사용입니다.