后端程序员转行前端,强烈推荐这6个前端UI框架,第二款小程序UI框架颜值最高!...

昨天有个同事问我有没有可以直接上手的前端UI框架。

那今天就给大家推荐6个简单、视觉体验好的前端框架

没吃过猪肉,肯定见过猪跑!

Jquery Mobile

demo地址:
https://demos.jquerymobile.com/1.1.0/

教程地址:
https://www.codesocang.com/jquerymobile/jquerymobile/7/index.html

这个应该是最简单的,能够快速上手了!

jQuery Mobile 还发布一个完整统一的jQuery移动 UI组件。支持全球主流的移动平台。

部件是功能丰富,有状态的插件。随着方法和事件,有一个完整的生命周期。

如果想5分钟就能直接上手的,Jquery Mobile首当其冲!

ColorUI

github地址:
https://github.com/weilanwl/ColorUI

官网地址:
https://www.color-ui.com/

鲜亮的高饱和色彩,专注视觉的小程序组件库

ColorUI 是小程序组件库,但不是纯样式库。由于WeUI有些淡雅,可能不合某些时尚公司的风格,因此 ColorUI 也有庞大的追捧者。

github上标星高达8.8k

相信你肯定有用过使用ColorUI的小程序

如果要开发小程序,这款开源框架是一个不错的选择。

Material

material design风格的前端css框架

官方网站:
http://materializecss.com/

中文学习站:
http://www.materializecss.cn/

使用非常简单,只需要引入css和js就行

<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css"><!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>

可以使我们的页面颜色更鲜艳,动画效果更突出(符合Material Design的设计风格)

究竟什么是Material Design?

设计是创造的艺术,我们的目标就是要满足不同的人类需要。人们的需要会随着时间发展,我们的设计,实践,以及理念也要随之提升。我们在自我挑战,为用户创造了一个可视化语言,它整合了优秀设计的经典原则和科学与技术的创新。这就是Material Design。

关于Material Design,其亲爹谷歌是这么介绍的。

其核心思想就是把物理世界的体验带进屏幕。去掉现实中的杂质和随机性,保留其最原始纯净的形态、空间关系、变化与过渡,配合虚拟世界的灵活特性,还原最贴近真实的体验,达到简洁与直观的效果。

Layui

官网地址:
https://www.layui.com/

github地址:
https://github.com/sentsin/layui/

layui(谐音:类UI) 是一款采用自身模块规范编写的前端 UI 框架,遵循原生 HTML/CSS/JS 的书写与组织形式,门槛极低,拿来即用。

其外在极简,却又不失饱满的内在,体积轻盈,组件丰盈,从核心代码到 API 的每一处细节都经过精心雕琢,非常适合界面的快速开发。

layui 首个版本发布于2016年金秋,她区别于那些基于 MVVM 底层的 UI 框架,却并非逆道而行,而是信奉返璞归真之道。

准确地说,她更多是为服务端程序员量身定做,你无需涉足各种前端工具的复杂配置,只需面对浏览器本身,让一切你所需要的元素与交互,从这里信手拈来。

weui

github地址
https://github.com/weui/weui

同微信原生视觉体验一致的基础样式库

WeUI是一套同微信原生视觉体验一致的基础样式库,为微信Web开发量身设计,可以令用户的使用感知更加统一。包含button、cell、dialog、toast、article、icon等各式元素

image

frozenui

github地址
https://github.com/frozenui/frozenui

image

FrozenUI的CSS组件库,基于腾讯手Q样式规范。特点FrozenUI 是一套基于移动端的UI库,轻量、精美、遵从手机 QQ 设计规范。

适用于使用手Q规范设计的Web页面,而针对非手Q规范的页面,可通过修改变量定制界面主题,并且可以按需选择需要的组件。

使用iconfont展示图标,包含了按钮,列表,表单,提示,弹窗等常用组件,新增文本,布局,1px, rem,文字截断,占位,两端留白,两端对齐等解决方案,同时解决了移动端屏幕适配问题。

结语

当然如果你觉得还有更容易上手的前端ui框架,评论告诉大家把!

往期推荐

怪不得同事的上网从没广告,原来一直偷偷安装了这三款插件

爬虫利器XPath Helper,高效解析网页内容

收藏级干货:Chrome插件(扩展)开发全攻略

推荐一个有趣的开源项目,藏着git快速入门的秘密!

开源神器:微信头像卡通化,马上520了,推荐尝试!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/309415.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Kubernetes引发“军备赛”,K8s真是企业生存的关键吗

导语与许多其他国家一样&#xff0c;英国对云基础架构的需求空前增长。随着学校&#xff0c;办公室&#xff0c;商店和饭店的关闭以应对疫情&#xff0c;云驱动的应用程序应运而生&#xff0c;解决挑战并提供安慰。随着各个年龄段人群的屏幕时间激增&#xff0c;数据中心正努力…

【新插件发布】AzureAD运维Excel版插件,增删改查快10倍c以上!

在笔者的BI项目开发中&#xff0c;用到了Azure的AzureSQL和AzureAS分析服务&#xff0c;此两大服务&#xff0c;可和AzureAD帐号体系打通。而AzureAD帐号&#xff0c;在其免费功能基础功能上&#xff0c;是免费使用的&#xff0c;随着项目开发上线进入运维阶段&#xff0c;Azur…

数论相关

目录符号整除/同余理论常见符号数论函数常见符号其他常见符号位运算与、或、异或取反左移和右移复合赋值位运算符关于优先级位运算的应用有关 2 的幂的应用取绝对值取两个数的最大/最小值操作一个数的二进制位模拟集合操作快速幂模意义下大整数乘法快速乘高精度快速幂欧拉降幂求…

博客系统知多少:揭秘那些不为人知的学问(二)

点击上方关注“汪宇杰博客”上篇《博客系统知多少&#xff1a;揭秘那些不为人知的学问&#xff08;一&#xff09;》介绍了博客的历史、我的博客故事及博客的受众来源。本篇精彩继续&#xff0c;介绍博客基本功能设计要点。1.“博客”的前世今生2.我的博客故事3.谁是博客的受众…

二分+01分数规划+最大化平均值 Dropping tests POJ - 2976

题意&#xff1a; 给你若n个分数&#xff0c;分子a[i]a[i]a[i],分母b[i]b[i]b[i],使满足公式100⋅∑i1nai∑i1nbi100\cdot\tfrac{\sum_{i1}^{n} a_{i}}{\sum_{i1}^{n} b_{i}}100⋅∑i1n​bi​∑i1n​ai​​&#xff0c;求任意去掉k个分数后&#xff0c;公式结果最大值。 题目…

基于 abp vNext 和 .NET Core 开发博客项目 - 博客接口实战篇(四)

系列文章使用 abp cli 搭建项目给项目瘦身&#xff0c;让它跑起来完善与美化&#xff0c;Swagger登场数据访问和代码优先自定义仓储之增删改查统一规范API&#xff0c;包装返回模型再说Swagger&#xff0c;分组、描述、小绿锁接入GitHub&#xff0c;用JWT保护你的API异常处理和…

莫比乌斯反演/容斥 +2020ICPC 江西省大学生程序设计竞赛 A Simple Math Problem

题目描述 输入描述: 输出描述: 示例1 输入 3 输出 5 分析&#xff1a; 1.这个题其实考的是一个莫比乌斯反演题&#xff0c;但是由于我知识储备不够&#xff0c;没有看出来&#xff0c;题目给的范围可以瞎搞一下&#xff0c;所以下面容斥可以过。 2.转换一下就是一道经典的…

猎鹰与龙飞船基于Linux,采用C++、Chromium与JS开发

最近两天科技界最重大的事件莫过于马斯克的 SpaceX 成功实现了猎鹰 9 号&#xff08;Falcon 9&#xff09;带着龙飞船&#xff08;Crew Dragon&#xff09;成功发射&#xff0c;并使飞船与国际空间站对接&#xff0c;将 NASA 两名宇航员送上了轨道前哨。背后关于 Falcon 9 与 C…

博客系统知多少:揭秘那些不为人知的学问(四)

点击上方关注“汪宇杰博客” ^_^上篇《博客系统知多少&#xff1a;揭秘那些不为人知的学问&#xff08;三&#xff09;》介绍了博客协议或标准。本篇终章介绍设计博客系统有哪些知识点。1.“博客”的前世今生2.我的博客故事3.谁是博客的受众&#xff1f;4. 博客基本功能设计要点…

Azure 国际版与中国版服务列表对(2020年6月版)

点击上方关注“汪宇杰博客” ^_^对于选择Azure平台的用户来说&#xff0c;会面临选择国内还是国际版的问题。由于一些原因&#xff0c;由世纪互联运营的中国大陆版Azure无法落地所有的国际版服务。相比几年前&#xff0c;情况已经有了一定的改善。本文列出了国际版和国内版Azur…

解读三组容易混淆的Dockerfile指令

长话短说&#xff0c;今天分享三组容易混淆的Dockerfile指令&#xff0c; 帮助大家编写更优雅的Dockfile文件、构建更纯净的Docker镜像。COPY vs ADDCOPY、ADD主体功能类似&#xff1a;从指定位置src拷贝文件到Docker镜像dest。COPY <src>... <dest> ADD <src&…

ASP.NET Core使用Nacos SDK访问阿里云ACM

背景 前段时间&#xff0c;cranelee 在Github上给老黄提了个issues&#xff0c; 问到了如何用Nacos的SDK访问阿里云ACM。https://github.com/catcherwong/nacos-sdk-csharp/issues/13刚看到这个issues的时候&#xff0c;老黄也是觉得一脸懵逼&#xff0c;好像这两者没有什么必然…

为.netcore助力--WebApiClient正式发布core版本

1、前言NCC WebApiClient 已成熟稳定&#xff0c;发布了WebApiClient.JIT 和 WebApiClient.AOT 两个 NuGet 包&#xff0c;累计近 10w 次下载。我对它的高可扩展性设计相当满意和自豪&#xff0c;但 WebApiClient 并不因此而停下脚步&#xff0c;在一年前&#xff0c;我产生了编…

一个static和面试官扯了一个小时,舌战加强版

一&#xff1a;背景1. 讲故事最近也是奇怪&#xff0c;在社区里看到好几篇文章聊static 的玩法以及怎么拿这个和面试官扯半个小时&#xff0c;有点意思&#xff0c;点进去看都是java版的&#xff0c;这就没意思了&#xff0c;怎么也得有一篇和面试官扯C# 中的 static用法撒&…

数据结构整理中。。。

目录栈队列链表单向链表双向链表向链表中插入&#xff08;写入&#xff09;数据单向链表单向循环链表双向循环链表从链表中删除数据单向&#xff08;循环&#xff09;链表双向循环链表哈希表哈希函数冲突拉链法闭散列法并查集启发式合并&#xff08;按秩合并&#xff09;带权并…

.NET开发者省份分布排名

什么叫.NET开发者省份分布排名呢&#xff1f; 顾名思义&#xff0c;这几个词大家都认识&#xff0c;.NET开发者都集中在城市&#xff0c;涵盖一线城市到五线城市。排名的方法非常简单粗暴&#xff0c;就是根据本公众号&#xff08;dotnet跨平台&#xff09;的省份订阅读者数量排…

创建型模式——单例模式

一、 实验目的与要求 1.练习使用单例模式。设计相关的模拟场景并进行实施&#xff0c;验证模式特性&#xff0c;掌握其优缺点。 2.实验结束后&#xff0c;对相关内容进行总结。 二、实验内容 1.模式应用场景说明 在山区或者边远地区火车站往往只有一个窗口在买票&#xff0c;但…

Sql Server之旅——终点站 nolock引发的三级事件的一些思考

曾今有件事情让我记忆犹新&#xff0c;那年刚来携程不久&#xff0c;马上就被安排写一个接口&#xff0c;供企鹅公司调用他们员工的差旅信息&#xff0c;然后我就三下五除二的给写好了&#xff0c;上线之后&#xff0c;大概过了一个月。。。DBA那边报告数据库出现大量锁超时&am…

创建型模式——原型模式

一、 实验目的与要求 1.练习使用单一模式。设计相关的模拟场景并进行实施&#xff0c;验证模式特性&#xff0c;掌握其优缺点。 2.实验结束后&#xff0c;对相关内容进行总结。 二、实验内容 1.模式应用场景说明 原型模式&#xff1a;在需要一个类的大量对象的时候&#xff0c;…

现在就是.Net最好的时代!我赞成,谁反对?

2020年.NET Core逆袭冲榜&#xff0c;多榜直接冠军&#xff01;Build2020&#xff0c;发布多款产品赋能.NET开发者&#xff01;截止5月&#xff0c;腾讯&#xff0c;阿里&#xff0c;特斯拉等大厂都在招聘.NET&#xff01;这些征兆&#xff0c;都预示着.NET的春天即将到来&…