PlaceHolder - 샘플이미지를 url, html소스로 빠르게 자동 생성

Placeholder.com(플레이스홀더) ?
빠르고 간단한 이미지 자리 표시 생성기 사이트입니다.
즉, 시안 작업시 샘플 이미지를 자동 생성해서 url or html소스로 바로 적용할 수 있게 해줍니다.

 

 

사이트 링크 주소 - https://placeholder.com/

Placeholder.com: Placeholder.com – The Free Image Placeholder Service Favoured By Designers

 

 

 

적용 방법은 2가지입니다. (url , code)

---

1. 첫번째는, URL 로 적용하는 방법입니다.
2. 두번째는, html code 로 적용하는 방법입니다.

 

 

 

 

"url" or "html" 소스를 써서 적용하는 예시입니다. (사이즈, 색상 변경 가능!)

 

1. "url" 로 적용 시

---

600x300 부분 은 가로x세로 (px수치를 적으면 됩니다.)

 

http://via.placeholder.com/600x300

 

 

컬러를 넣고 싶을 땐, 앞 '000000' 은 배경 색상, 뒤 "ffffff" 은 글자 색상 입니다.

 

http://via.placeholder.com/250/000000/ffffff

 

 

http://via.placeholder.com/250/ff9900/000000

 

 

텍스트를 적용할 때는 "?text=내용입력" 형태로 입력하면 됩니다.

 

http://via.placeholder.com/300?text=Placeholder.com+rooks!

 

 

이미지 포맷 적용시 ".gif, .jpg, .png" - 그럼, 지정한 포맷대로 이미지가 다운 가능해집니다!

 

http://via.placeholder.com/300.png/09f/fff

 

 

---

 

 

2. "html" 코드로 적용 시

---

code 로 적용할 때는 아래처럼 html 소스 부분에 삽입하면 이미지 자리가 배치가 됩니다.

 

<a href="https://placeholder.com"><img src="http://via.placeholder.com/350x150"></a>

 

 

 

---

※ 유튜브 영상으로 보기

유튜브 구독하기 : https://www.youtube.com/channel/UCcUay1K9SPKkM0NswclTl0Q?sub_confirmation=1
아래 영상 url : https://youtu.be/ICCg537MXBk