더미 이미지
2021. 9. 6. 09:42ㆍ웹랩/html&css
반응형
예제 이미지 사용하기 (해당 영역에 맞는 사이즈의 이미지 넣기)에 유용한 사이트 두개를 소개합니다.
무료로 사용 가능한 더미이미지 다음과 같이 사용합니다:
<img src="http://lorempixel.com/400/200">
http://placeholder.com/
이미지 크기 및 형식 (.GIF, .JPG, .PNG, .WEBP) , 배경색 및 텍스트 색상, 텍스트 를 지정할 수 있습니다.
- https://via.placeholder.com/150 150x150 이미지
- https://via.placeholder.com/150x100 150x100 이미지
- https://via.placeholder.com/300/09f/fff.png 이미지 파일 확장자
- https://via.placeholder.com/728x90.png?text=Visit+WhoIsHostingThis.com+Buyers+Guide 사용자 정의 텍스트(공백은 더하기로 지정)
- https://via.placeholder.com/840x450/808080/ffffff 색상 코드로 배경/글자 색상 지정
http://lorempixel.com/
- http://lorempixel.com/400/200 400 x 200 임의의 사진
- http://lorempixel.com/g/400/200 400 x 200 임의 회색 사진
- http://lorempixel.com/400/200/sports 스포츠 카테고리의 무작위 사진
- http://lorempixel.com/400/200/sports/1 사진 번호를 얻으려면 스포츠 카테고리에서 1/10
- http://lorempixel.com/400/200/sports/Dummy-Text... 임의의 그림 에 사용자 지정 텍스트
- http://lorempixel.com/400/200/sports/1/Dummy-Text... 선택한 그림 에 사용자 정의 텍스트
반응형
'웹랩 > html&css' 카테고리의 다른 글
not css (0) | 2021.10.13 |
---|---|
모바일 웹 개발 시 주의할 점 (0) | 2018.05.30 |
CSS 초기화 (0) | 2018.05.30 |
text-transform으로 영문 대소문자 표현하기 (0) | 2018.04.03 |
나눔바른고딕 웹폰트 (0) | 2016.08.22 |