Home > Web Front-end > HTML Tutorial > 跟上趋势!免费提供网站背景视频素材的Coverr(可商用)_html/css_WEB-ITnose

跟上趋势!免费提供网站背景视频素材的Coverr(可商用)_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:25:55
Original
2347 people have browsed it

现在很常看到网站把视频做成首页背景,不用按下播放按钮,就有动态显示效果,跟以往静态图片相较下更动态、更有活力,不过要寻找合适的免费影片就不是那么容易,若没有预算自己拍摄,可以到本文介绍的 Coverr 来找找网站提供的免费首页背景影片素材,这里的素材皆能在线预览、免费下载,而且使用上没有任何限制。

Coverr 收录许多适合放在网站首页做为背景的影片,这些影片采用 CC0 授权,也表示可以自由、免费下载并用于任何地方,无须标示出处或原作者。Coverr 会在每周一更新七个全新影片,目前在这里也可以找到超过 20 个以上短片。

Coverr 收录的影片涵盖各种类型,包括食物、情绪、自然、科技、朦胧、人物、城市以及动物,不仅可以在线预览,无须注册就能够直接下载,透过网站提供的程序代码将影片嵌入网站,非常方便。

若你正在寻找将动态影片运用于网站首页背景的方法,Coverr 是个不错的免费资源。

Coverr

STEP 1

开启 Coverr 网站后,将窗口往下拖曳,可以找到网站收录的所有影片素材。跟一般影片不一样的是这些影片长度普遍都不会太长(为了要节省加载时所耗费的时间),而且多半能够重复播放,效果不错。

STEP 2

在点选 Coverr 网站内的任一影片后,会出现影片预览,点选「Set it as a Coverr」能将影片设定成网站首页的背景,直接预览在网页内呈现出来的效果。喜欢的话,点选右下角的绿色下载按钮即可取得影片原始文件。

STEP 3

如果你对于如何将影片嵌入网页、使它成为不间断回放的背景有些疑问,Coverr 网站内也提供了如何使用(How to use)的程序代码范例,只要把影片下载,依照 HTML、CSS 和 JavaScript 范例链结稍作修改,就能在网页内看到影片背景效果。

值得一试的三个理由:

  1. 收录许多可用于网页背景的免费影片素材
  2. 影片采用 CC0 授权,可自由下载、使用于任何用途
  3. 网站提供基本的使用范例,含 HTML、CSS 和 JavaScript

酷站 彩蛋: Bootswatch

Bootstrap 是一款流行好用的前端框架,使用的人越来越多,但正因如此,很多直接套用 Bootstrap 风格网站看起来十分相似,这对于网站的视觉体验可能会受到影响,所以建议使用BS框架的用户应该尝试修改下样式。

今天为大家推荐 Bootswatch 网站,该网站目前拥有21款免费 Bootstrap 框架皮肤,对于想得到不同设计风格的用户来说这是一个简单而快速的方式。

打开网站后,你会看到首页有20多款皮肤,选择你喜欢的一款,然后按「Download」下载,如下图:

此时你应该下载了一个文件名为「Bootstrap.css」的文件,用这个文件替换到Bootstrap 自带的「Bootstrap.css」即可成功更换皮肤咯,整个过程简单快捷。

本文就介绍到这里,还在使用BS默认风格的用户请尝试换换新 Style 吧!

「Illustrator新手教程合集」

同类型纹理教程:

《AI教程:手把手教你用AI创建漂亮的无缝几何图案》

简单好上手,效果还很赞!长投影教程:

《AI新手教程:教你创建精致闪亮的长投影宝石》

据说是目前最火的设计趋势:

《AI新手教程!教你简单快速地将图片变成多边形背景》

原文地址: free.com / shejidaren

【优设网 原创文章 投稿邮箱:2650232288@qq.com】

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template