<source> 태그의 srcset 속성
HTML <source> 태그 ⇒
정의 및 특징
<source> 태그의 srcset 속성은 각각 다른 환경에서 사용될 이미지의 URL을 명시합니다.
<source> 요소가 <picture> 요소 내부에 사용될 때는 반드시 srcset 속성이 명시되어야 합니다.
문법
| <source srcset="URL"> |
속성값
| 속성값 | 설명 | |
|---|---|---|
|
URL |
이미지 파일의 URL
1. 절대 주소(absolute URL) ex) href=“http://www.tcpschool.com/sample.jpg” 2. 상대 주소(relative URL) ex) href=“/meida/sample.jpg” |
예제
<picture>
<source media="(min-width: 700px)" srcset="/examples/images/people_960.jpg">
<source media="(min-width: 400px)" srcset="/examples/images/people_575.jpg">
<img src="/examples/images/people_200.jpg" alt="People">
</picture>
지원하는 브라우저 및 버전
| 속성명 |
|
|
|
|
|
|
|---|---|---|---|---|---|---|
| srcset | 지원함 | 지원함 | 지원함 | 38.0 | 9.0 | 25.0 |
HTML5에서 변경된 사항
<source> 태그는 HTML5에서 새롭게 추가된 요소입니다.
