HTML과 인터넷

태그(tag)와 속성(attribute)

2022. 7. 24. 22:36

태그(tag)와 속성(attribute)


 

HTML 속성(HTML attribute)

HTML 요소 유형의 수정자(modifier)

속성(attribute)은 태그의 동작을 제어하기 위해 "여는 태그" 안에 사용되는 특수 용어이다.

 

속성은 요소 유형의 기본 기능을 수정하거나 스스로 기능하지 못하는 특정한 요소 유형에 기능을 제공한다.

 

사용법

일반적으로 이름-값 쌍으로 나타낸다.

구분은 =

요소의 이름 뒤 요소의 시작 태그 안에 작성된다.

작성에 있어서 속성의 순서는 상관없다.

 

<태그 속성="값">content to be modified by the tag</태그>

 

img 태그에는 어떤 이미지의 정보를 불러올지에 대한 '정보'가 필요하다.

이 정보를 넣어줄 수 있는 것이 바로 속성(attribute) 

src(source) 를 사용하면 원하는 이미지에 대한 정보를 img 태그에 담아줄 수 있다.


예시를 통해 공부해보자.

 

이미지 넣기

 

1. 원하는 이미지 다운로드 받아서 프로젝트 폴더에 넣는다.

2. 웹페이지 파일과 같은 위치에 이미지 파일을 넣어준다면 src 속성의 값으로  파일 이름만 적어주면 된다.

<html>  
    <title>2022 여름</title>
    <body>
        <img src="sea.jpg" alt="Girl in a jacket" width="1000" height="600">
        <h1>랜선으로 접하는 시원한 바다</h1>
        북적이는 휴양지 대신 찾아본 잔잔하게 시원한 파도 
    </body>
</html>

html 과 같은 위치에 넣어준 이미지 파일 sea.jpg

 

3. html 파일의 경로 확인해보기

img src(source)는 내 컴퓨터에 저장되는 것이 아니라면 이미지 주소를 활용해서 넣어주면 된다.

 

 

 

 

<참고>

https://ko.wikipedia.org/wiki/HTML_%EC%86%8D%EC%84%B1

 

HTML 속성 - 위키백과, 우리 모두의 백과사전

 

ko.wikipedia.org

 

'HTML과 인터넷' 카테고리의 다른 글

웹페이지를 아름답게, CSS  (0) 2022.07.26
태그 간의 관계와 목록  (0) 2022.07.24
HTML, 그리고 TAG  (0) 2022.07.22
HTML 코딩 실습 환경 준비하기 💻  (0) 2022.07.22
코딩, HTML  (0) 2022.07.22