JavaScript & HTML/HTML
HTML Attributes (속성)
husks
2018. 3. 27. 18:07
반응형
HTML Attributes
HTML Attributes는 요소에 대한 추가 정보를 제공합니다.
모든 HTML 요소(Elements)는 속성(Attributes)을 가질 수 있습니다.
속성은 요소에 대한 추가 정보를 제공합니다.
속성은 항상 시작 태그에 지정 됩니다.
속성은 일반적으로 다음과 같이 이름="값" 쌍으로 옵니다. (name="value")
href 속성
HTML 링크는 <a>태그로 정의 되고 주소 내용은 href 속성에서 지정 됩니다.
1 | <a href="http://huskdoll.tistory.com">Husk's repository</a> |
src 속성
HTML 에서 이미지를 삽입하는 대표적인 태그는 <img> 입니다.
해당 태그의 이미지 파일 이름(경로)는 src 속성에서 정의 됩니다.
1 | <img src="img_test.jpg"> |
너비와 높이 특성
<img> 태그의 이미지 너비와 높이를 지정하는 속성이 존재 합니다. (width, height)
1 | <img src="img_test.jpg" width="300" height="400"> |
설정한 이미지 크기는 픽셀 단위 입니다.
alt 속성
이미지의 경로가 잘 못되거나 하면 이미지를 표시 하지 못할때 alt 속성이 대체 텍스트를 보여줍니다.
해당 부분은 필수는 아니지만 웹 접근성을 위해 지정하는것이 좋습니다.
1 | <img src="img_test.jpg" alt="테스트 이미지" width="300" height="400"> |
스타일 속성
style 속성은 색상, 폰트 크기와 같은 요소의 스타일을 지정하는데 사용합니다.
1 | <p style="color:red">Husk's repository</p> |
제목 속성
title 속성은 <p> 요소의 속성으로 마우스를 가져가면 title 속성 값이 툴팁으로 표시 됩니다.
1 | <p title="허스크의 저장소" style="color:red">Husk's repository</p> |
따옴표 OR 이중 따옴표
속성값에 따옴표를 넣으려면 겉을 이중 따옴표로 감싸주고
이중 따옴표를 넣으려면 따옴표로 감싸 주세요.
1 2 | <p title="Husk 'repository'"> <p title='Husk "repository"'> |
반응형