Сегодня мне кинули ссылку на прикольный сервис для быстрого генерирования заглушек изображений. Может пригодиться для html-верстки. Не нужна регистрация, не нужно там вообще на самом сайте ничего вводить.
Пишете сразу у себя в коде, например:

Update. Благодаря усилиям k0rv1n, найден вариант этого сервиса, только лучше :)
Во-первых, там поддерживается кириллица. Во-вторых, там даны ссылки на исходники для разных языков.
Автор dummyimage.com — тот же Russell Heimlich, что и у placehold.it. У placehold.it есть ещё один автор, но будем считать, что он делал дизайн (дизайн там правда круче, но видимо как раз из-за понтового шрифта Unicode и не выходил).
Примеры (см. под хабракатом) я поменял с placehold.it на dummyimage.com, раз уж он функциональнее…
Итак, примеры:
1. Для квадратной заглушки достаточно одного числа:

2. Меняем цвет (всегда должен идти после размера, иначе не сработает):

3. Меняем формат (добавляем расширение к любой части url-а; поддерживается 3 формата — gif, jpg/jpeg, png):

4. Добавляем текст (вместо пробела — плюс):

5. Меняем цвет текста (он идёт после цвета самой заглушки):

P.S.Кто может предложить адекватный перевод слова "плейсхолдер"? nooze предложил "заглушку" :)
P.P.S. Авторы сервиса — некие Brent и Russell, пишут там внизу, что сделали его для того, чтобы (как они надеются) сэкономить кому-то немного времени.
Источник
Пишете сразу у себя в коде, например:
<img src="http://placehold.it/350x50" />и получаете:
Update. Благодаря усилиям k0rv1n, найден вариант этого сервиса, только лучше :)
Во-первых, там поддерживается кириллица. Во-вторых, там даны ссылки на исходники для разных языков.
Автор dummyimage.com — тот же Russell Heimlich, что и у placehold.it. У placehold.it есть ещё один автор, но будем считать, что он делал дизайн (дизайн там правда круче, но видимо как раз из-за понтового шрифта Unicode и не выходил).
Примеры (см. под хабракатом) я поменял с placehold.it на dummyimage.com, раз уж он функциональнее…
Итак, примеры:
1. Для квадратной заглушки достаточно одного числа:
<img src="http://dummyimage.com/120" />Результат:
<img src="http://dummyimage.com/100" />
<img src="http://dummyimage.com/80" />
2. Меняем цвет (всегда должен идти после размера, иначе не сработает):
<img src="http://dummyimage.com/150x60/c0c0c0" />Результат:
<img src="http://dummyimage.com/150x60/00dd00" />
<img src="http://dummyimage.com/150x60/a6a6ff" />
3. Меняем формат (добавляем расширение к любой части url-а; поддерживается 3 формата — gif, jpg/jpeg, png):
<img src="http://dummyimage.com/150x60/99cccc.gif" />Результат:
<img src="http://dummyimage.com/150x60.jpg/99cccc" />
<img src="http://dummyimage.com/150x60/99cccc.jpeg" />
<img src="http://dummyimage.com/150x60.png/99cccc" />




4. Добавляем текст (вместо пробела — плюс):
<img src="http://dummyimage.com/150x60/99cccc.gif&text=The+image!" />Результат:
<img src="http://dummyimage.com/150x60/99cccc.jpg&text=The+image!" />
<img src="http://dummyimage.com/150x60.png/99cccc&text=The+image!" />
<img src="http://dummyimage.com/150x60.png/99cccc&text=Кириллица" />




5. Меняем цвет текста (он идёт после цвета самой заглушки):
<img src="http://dummyimage.com/150x60/99cccc/ffffff.gif&text=The+image!" />Результат:
<img src="http://dummyimage.com/150x60/99cccc.jpg/0b0b0b&text=The+image!" />
<img src="http://dummyimage.com/150x60.png/99cccc/aa00aa&text=The+image!" />



P.S.
P.P.S. Авторы сервиса — некие Brent и Russell, пишут там внизу, что сделали его для того, чтобы (как они надеются) сэкономить кому-то немного времени.
Источник
Комментариев нет:
Отправить комментарий