Bootstrap现在发展到了第四个版本, 作为最火的响应式网站开发模板, 它帮助了千千万万的响应式开发工程师快速的开发响应式网站,但是唯一美中不足的是,UI界面往往容易让人看起来过为相似, 现在Bootstrap UI kit方案解决了这些问题,我们可以方便的添加独特的UI组件到我们的设计效果中
Wrapkit就是UIkit的一种解决方案, 它扩展了Bootstrap4,使用了扁平化的设计模式。 让你方便的创建复杂的网站, 登陆页面,即将来到页面等等, 即使你没有任何比较深入的设计技巧或者经验,也一样的可以快速的设计网站, 它从自己的角度重新设计了整个UI,包括简单的UI元素,及其复杂的完整页面布局
设计元素
最重要的一点是Wrapkit可以让你安全的使用Bootstrap的网格系统,包含所有的class定义,及其以下所有的内容
文字排版
Wrapkit重新定义了文字排版, 不单单是文字,还包含了类似引用和列表等等的样式, 最好的地方在于这些文字排版类可以应用到一般的Bootstrap网站中去
徽章
对于徽章来说也是一样。 你可以使用老的Bootstrap类来定义,但是得到完全崭新的UI页面效果, 包含了更多的扁平化设计
卡片
卡片是Wrapkit里最后包含了设计元素, 然而这有更多其它设计元素,包括了Overlay及其进度条等等, 但是Wrapkit卡片基于Bootstrap卡片。 但是样式完全的不一样。
界面部分
Wrapkit真正强大的地方在于预先设定和准备的界面及其页面模板, 你可以简单的拿来添加到你的页面中去,界面部分可以用来帮助你快速的创建不同的页面部分
幻灯
虽然Bootstrap4没有提供轮播图组件, Wrapkit提供了10个不同的幻灯布局来丰富你的UI设计
下面的预览图中你可以看到, 所有的设计元素都预设了。包括了内边距,外边距,文件域,按钮等等。
你只需要拿到代码并且开始使用即可
表单横幅
另外一个非常好的预设组件, 包含了9套相关的设计,全部都可以拿来就用
除了幻灯和表单横幅, Wrapkit也提供了很多预设的布局,导航,页脚,报价单等等UI设计和组件,满足大家各种需求
页面模板
Wrapkit团队也创建了很多页面模板
作品集页面
提供了很多实用的作品集页面, 包含了不同的列设计及其额外的功能,例如, masory布局, 详细展示,弹出组件等等
联系我页面
包含了很多专业漂亮的联系页面
网购模板
包含了丰富的在线商城相关的模板, 能够很快的帮助你创建相关的网购体验
你可以看到相关页面模板的结账界面,设计的非常简单到位
其它相关演示
当然wrapkit也包含了很多其它类型的网站, 例如,会计代理网站, 或者是艺术家的作品集, 下面我们选择一些比较有意思的模板
创意代理
wrapkit的预定义创意代理演示包含了一个居中的方便操作的按钮模板, 包含了漂亮动画的横幅, 一个展示客户反馈的幻灯, 四列的页底包含了所有需要的商业信息
App登录页
包含了一个web和移动app的登录页面设计。 使用了极简导航风格, 拥有一些报价设计及其相关的横幅设计
慈善类网站
包含了创建慈善网站所需要的全部功能, 响应式导航, 实用按钮设计, 非常方便的慈善捐款收集功能,还有注册等等附属功能
免费的wrapkit可以在这里下载: WrapKit Lite ,希望大家会喜欢!
注:本文内容来自互联网,旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜,请你联系站长进行处理。