반응형
제목 속성(the title arrtibute)
<!DOCTYPE html>
<html>
<body>
<h2 title="I'm a header">The title Attribute</h2>
<p title="I'm a tooltip"> Mouse over this paragraph,
to display the title attribute as a tootip.</p>
</body>
</html>
-> 마우스로 제목부분이나 단락 부분에 놓을경우 title 속성에 대한 정보를 나타낸다.
href 속성(the href attibute)
<!DOCTYPE html>
<html>
<body>
<h2> The href Attribute</h2>
<p>HTML links are defined with the a tag.
The link address is specified in the href attribute</p>
<a href="https://www.naver.com">Visit naver</a>
</body>
</html>
-> 링크를 정의하는 태그로 <a href>를 사용한다.
-> 페이지에 써있는 Visit naver를 클릭할 경우 naver화면으로 넘어간다.
너비와 높이(the width and height attributes)
<!DOCTYPE html>
<html>
<body>
<h2>Width and Height Attribute</h2>
<p>The width and height attributes of the img tag, defines the width
and height of the image:
</p>
<img src="eximage.jpg" width="500" height="600">
</body>
</html>
-> 너비를 나타내는 태그: width
-> 높이를 나타내는 태그: height
alt 속성(the alt attribute)
<!DOCTYPE html>
<html>
<body>
<h2>The alt Attribute</h2>
<p>The alt attribute should reflect the image content,
so users who cannot see the image get an understanding of what the image contains</p>
</body>
<img src="eximage.jpg" alt = "fish" width="500" height="600">
</html>
-> 이미지가 나오지 않을경우 이 이미지가 무엇을 뜻하는지 알려주기위한 속성이다.
-> 태그는 alt를 사용
" "없는 link속성(attribute without quotes)
<!DOCTYPE html>
<html>
<body>
<a href=http://www.naver.com>This is a link</a>
</body>
</html>
-> 위의 link속성과 다르게 ""가 없어도 링크에 접속이 가능하다.
반응형
'웹프로그래밍 > HTML' 카테고리의 다른 글
HTML 테이블,셀 사용법 <table>, <th>,<td>, <tr> (0) | 2023.09.04 |
---|---|
HTML 이미지 스타일 우선순위 (0) | 2023.09.04 |
HTML Links 링크 이미지, 주소 넣기 (0) | 2023.09.03 |
HTML Styles - CSS (0) | 2023.09.03 |
HTML Styles 속성(텍스트, 배경색, 폰트, 폰트크기) (0) | 2023.09.03 |
댓글