轩枫阁

首页 / Web前端 / 网页占位图服务推荐

网页占位图服务推荐

前言

在网站开发初期,做重构的过程中,经常要展示一些网站内容相关的不固定图片,如Banner图、产品图,这时候从设计稿中切图下来放上去会比较繁琐。常用的技巧是使用占位图。

占位图片即通过指定宽高或文字动态生成指定尺寸的图片。有很多提供类似服务的网站,接下来一一推荐。

纯色类

temp.im

简介:im temp placeholder images, feel free to use it anywhere. (with https supported)。

temp.im占位图片,可以在任何地方免费使用,支持HTTPS。

特点:支持定义尺寸、颜色。使用七牛CDN服务,访问超快,推荐使用,微信UI工程师@hzlzh 作品。

使用

placehold.it

简介:A quick and simple image placeholder service. 一个快速和简单的占位图像服务。

特点:支持定制尺寸、颜色、文字、格式,支持HTTPS,老款占位图服务。

使用

Fake images please

简介:Fakeimg.pl is a little tool that generates images with an URL. Choose the size, the colors, even the text. It’s free and open-source.

特点:支持自定义尺寸、颜色、文字、字体。

使用

 

placeholder.cn

简介:Just put your image size after our URL and you’ll get a placeholder.

特点

使用

ImgServ

简介:一个简单快速生成占位图片的服务。

特点:支持自定义尺寸、背景颜色、字体颜色、文案

使用

fpoimg.com

简介:FPO means For Placement Only and is commonly used for providing a placeholder image where actual content will reside in a publication, website, or similar.

特点:支持定义尺寸、文案、背景字体色,还有可视化工具实时编辑预览图片,如制作手机端banner。工具:http://fpoimg.com/generator

使用

Dynamic Dummy Image Generator

简介:Dynamic Dummy Image Generator

特点:支持自定义尺寸、颜色、文案。支持关键字设置尺寸,如指定屏幕分辨率、视频格式、banner尺寸、按钮尺寸等。

使用

图片素材类

unsplash.it

简介:Beautiful placeholders using images from unsplash.

特点:非纯色图,支持获取随机图、灰度图、固定图、模糊图等,提供json图片列表接口。

使用

placekitten

简介:A quick and simple service for getting pictures of kittens for use as placeholders in your designs or code. Just put your image size (width & height) after our URL and you’ll get a placeholder.

特点:图片素材均是萌喵︿( ̄︶ ̄)︿   支持定义尺寸、灰度图

使用

http://placekitten.com/200/300

http://placekitten.com/g/200/300

placebeard.it

简介:Tired of everything being so cute and adorable? Enter placebeard.it. This site is yet another place holder image site.

特点:素材主题为胡须,各类胡子哥~~~^_^~~~  支持定义尺寸、灰度图。还有个关于熊素材的网站(https://placebear.com/)。

使用

lorempixel

简介:Placeholder Images for every case. Webdesign or Print. It’s simple and absolutely free! Just put the custom url in your code like this:
<img src=”http://lorempixel.com/400/200″ />
to get your FPO / dummy image.

特点:非纯色图,图片种类丰富,免费简单。

使用

工具类

griddle.it

简介:A clean and simple way to align your website layout. No complex grid frameworks necessary.

特点:用于帮助调整网站布局,设置图片尺寸、列数、间距后,将图片设置为背景,非常方便。

使用

本文标题:网页占位图服务推荐 - 轩枫阁

转载请务必注明出处,欢迎分享

如果觉得我的文章对您有用,欢迎打赏
赞  赏
赞赏作者 urnotivan
¥ 6.66
换个金额 使用微信扫一扫赞赏
  • 6.66
  • 8.88
  • 16.8
  • 2.33
  • 52.0
  • 20.0
  • 自定义
  • 10.0
71/470
73/470

相关阅读

文章评论

  • ,亮哥,问下,像京东淘宝那些还没加载出来的区块,不是img,这个是怎么搞的?类似懒加载div区块内容不止是img

    • 就滚动加载内容嘛,本来一个个空div,再获取填充就好

      • 这个知道,情况是我是想把内容放在textarea里面,滚动到textarea相应位置时加载内容进来,问题是我不知加载内容的高度情况下想使用个占位图占位,同时左边有个导航栏对应滚动到内容位置,类似京东商城,但他前提是知道外面内容的高度,~~~~(>_<)~~~~

  • 很不错,

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]

    点击开始录制,可以录制弹奏的曲子