Github : https://github.com/zdhxiong/mdui
MDUI 是一个轻量级的 Material Design 前端框架,对照着 Material Design 文档进行开发,争取 1:1 实现 Material Design 中的组件。
MDUI 拥有 19 种主色、 16 种强调色、和一种夜间主题。只需添加一个 CSS 类即可实现主题的切换。
可以点击官方文档右上角按钮观看主题切换效果。
包含所有主题的 CSS 文件仅 26.4KB minified + gzip
JavaScript 文件仅 12KB minified + gzip
且没有任何依赖
移动优先,可适配所有屏幕。
0.2.0 版本已发布,主要更新为:
mdui.JQ
来调用该库。 1
ss098 2016-12-29 14:06:03 +08:00
很棒,看你 Demo 的时候被吓了一跳。
|
2
lwjcjmx123 2016-12-29 14:06:52 +08:00 via Android
先 mark 一下,回头给你个星星
|
3
Famio 2016-12-29 14:10:54 +08:00
感謝!已經試用。
|
4
shellcodecow 2016-12-29 14:12:22 +08:00
文档写的不错~~ 特别是右上角有个界面展现的案列
已 Star |
5
Famio 2016-12-29 14:14:59 +08:00
已 star ,另外希望文檔能加入檢索功能,再次感謝
|
6
luo123qiu 2016-12-29 14:15:34 +08:00
很棒, star 支持。
|
7
aaronly 2016-12-29 14:17:36 +08:00 via iPhone
奈斯。回去给你 star
|
8
learnshare 2016-12-29 14:35:08 +08:00
细节不错
|
9
lynth 2016-12-29 15:04:58 +08:00
`star`
|
10
ourstars 2016-12-29 15:07:26 +08:00 via iPhone
看着好棒👍
|
11
denghongcai 2016-12-29 15:19:19 +08:00
棒极了
|
12
ashfinal 2016-12-29 15:22:14 +08:00
已 star
|
13
scys 2016-12-29 15:38:22 +08:00
很好,无依赖我喜欢这种库 :D
|
14
tlv2013 2016-12-29 15:39:25 +08:00
已 star
|
15
chenyiping1995 2016-12-29 15:41:25 +08:00 via Android
为什么感觉很像 materialize 框架……?
|
16
Slyutae 2016-12-29 15:43:23 +08:00
好棒,马上去 star
|
17
owlsec 2016-12-29 15:46:32 +08:00
star
|
18
DoraJDJ 2016-12-29 15:53:58 +08:00 via Android
不错,已 star
|
19
ipeony 2016-12-29 16:01:03 +08:00
赞 b( ̄▽ ̄)d
|
20
fy 2016-12-29 16:05:12 +08:00
很棒 已 star
|
21
kingcos 2016-12-29 16:11:01 +08:00 via iPhone
好赞! Star !
(想借楼问个小问题…可能问题比较粗糙… 最近在写课程设计,但不想仅限于课设。 准备写一个前后端分离的网站吧,未来可能自己再开发手机端,后端准备用 Spring Boot ,只提供 RESTFUL API 接口,这个已经基本弄好了。那么前端要用什么框架比较好呢?… UI 框架在考虑 Bootstrap 4 或者就这个也很好,好像还要用 Ajax …总之谢谢啦…) |
22
kingsleydon 2016-12-29 16:11:36 +08:00 via Android
star 文档很棒
|
23
flyingfz 2016-12-29 16:11:51 +08:00
基于 Material Design 的前端框架, 在手机浏览器上的性能都很差。
---------------- 我测试过: 在微信里 查看 demo ,几乎是一帧一帧的显示出来, chrome 会好一些,但也能感受到卡。 Material Design 确实很喜欢, 但手机上性能这么差,没法用啊。 |
24
flyingfz 2016-12-29 16:12:26 +08:00
先 star 下。
|
25
Tuisku 2016-12-29 16:12:29 +08:00
文档中:
涟漪颜色这里, WHITE 和 BLACK ,是不是弄反了? |
27
doubleflower 2016-12-29 17:21:47 +08:00 1
意外发现质量不错。
不过做应用大家都是用 vue/react 之类的组件了,纯 css 组件不方便。 |
28
jas0ndyq 2016-12-29 17:24:27 +08:00 via iPhone
厉害
|
29
phoenixlzx 2016-12-29 19:33:19 +08:00
Star 已送,最近大概会拿来做个页面(๑•̀ω•́)✧
|
30
greatghoul 2016-12-29 19:39:58 +08:00
很赞很赞
|
31
SorryChen 2016-12-29 19:51:04 +08:00 via iPhone
赞!已 star
|
32
Troevil 2016-12-29 19:59:12 +08:00
不错,不知道会不会出 vue 版~
|
33
renyijiu 2016-12-29 20:21:53 +08:00
不错不错,赞一个
|
35
anthozoan77 2016-12-29 20:24:51 +08:00
厉害!
|
36
fhefh 2016-12-29 20:46:57 +08:00
楼主 view-source:http://www.mdui.org/docs/ 这个页面
<html>和<body> 两个标签 貌似没有闭合 |
37
xiningxiao 2016-12-29 20:52:32 +08:00 via iPhone
mark 一下
|
38
yrom 2016-12-29 21:23:27 +08:00
这个得赞一下
|
40
sobigfish 2016-12-29 21:26:50 +08:00
http://www.mdui.org/docs/textfield 含图标 message 样式有点怪啊
|
41
RobertYang 2016-12-29 21:29:11 +08:00 via Android
棒
|
42
wq2016 2016-12-29 21:38:18 +08:00
666
|
43
U2FsdGVkX1 2016-12-29 22:15:34 +08:00
很棒的框架
已收藏 |
44
zdhxiong OP @sobigfish 那是个多行文本框,图标会保持和文本框底部对齐, message 文本在文本框顶部,和上面的单行文本框看起来不一样,但应该没什么问题。
|
45
hebeiround 2016-12-29 22:21:20 +08:00 via iPhone
已收藏 很棒
|
46
itfanr 2016-12-29 22:25:19 +08:00 via Android
很棒
|
47
sobigfish 2016-12-29 22:35:04 +08:00
|
48
zdhxiong OP @sobigfish 可能那张图片刚好是下面颜色深,导致渐变看起来不明显。现在的渐变应该是比较合适的。
0.26 这个是写死的。 |
49
ck65 2016-12-29 23:37:48 +08:00
nice and clean
cool and dry |
50
xcatliu 2016-12-29 23:45:16 +08:00 via iPhone
看起来很不错,支持
|
51
xcatliu 2016-12-29 23:46:53 +08:00 via iPhone
@doubleflower 借楼推荐一下更轻量级的 css 框架, http://getmobicss.com
|
52
xcatliu 2016-12-29 23:48:14 +08:00 via iPhone
|
53
metrue 2016-12-29 23:53:24 +08:00
挺屌的。
|
54
xcatliu 2016-12-30 00:04:10 +08:00 via iPhone 1
可以推荐到 chuangzaoshi.com @designer
|
55
Yien 2016-12-30 00:15:27 +08:00 via iPhone
感谢分享
|
56
lufficc 2016-12-30 00:20:01 +08:00 via Android
赞
|
57
designer 2016-12-30 00:36:15 +08:00 via iPhone
赞
|
58
ClassicOldSong 2016-12-30 01:50:05 +08:00 via Android
厉害了我的哥
已 star ,加油! |
59
gogobody 2016-12-30 01:52:32 +08:00 via Android
mark
|
60
blanu 2016-12-30 03:03:47 +08:00
相当棒!连按下去减慢涟漪的效果都有做!用来撸小应用那还不是不要不要的,爽~
|
61
xrlin 2016-12-30 08:30:36 +08:00
star ,很不错啊,下次尝试使用下
|
62
Cabana 2016-12-30 08:32:18 +08:00 via Android
已 start ,等会在自己实验田试试…
|
63
lzsadam 2016-12-30 09:10:40 +08:00
很用心,非常棒,已经 star
|
64
unique 2016-12-30 09:15:40 +08:00
很棒的前端项目,已 star
|
65
Hucai 2016-12-30 09:29:08 +08:00
对于我这种菜鸟新手来说,太棒了,文档也很棒
|
66
hronro 2016-12-30 09:29:26 +08:00
赞一个!
|
67
lwbjing 2016-12-30 09:32:29 +08:00
建议前缀用 md mdui 要多打两个...
|
68
shingoxray 2016-12-30 09:40:34 +08:00
非常棒,很轻量,+*
|
69
CrispElite 2016-12-30 09:41:55 +08:00
厉害厉害 ,应该花了不少时间和精力 赞
|
70
VtoEXL 2016-12-30 09:43:47 +08:00
很好看
|
71
LWXYFER 2016-12-30 10:01:36 +08:00
不了解 gzip , 但是从 CSS 体积从 240.52KB 到 26.4KB , 这么高压缩率啊。
|
72
zdhxiong OP @LWXYFER 因为 CSS 中大部分是各种主题,不同主题的代码只有颜色是不同的,其他都相同。 gzip 会把相同的内容压缩掉。
|
73
qping 2016-12-30 10:36:50 +08:00
咨询个问题,像 a 标签之类的下划线颜色可以改吗
|
74
qping 2016-12-30 10:40:20 +08:00
不用回我了,仔细看了下文档,<body class="mdui-theme-primary-indigo mdui-theme-accent-indigo">,就可以了 :)
|
75
mink 2016-12-30 10:42:42 +08:00
很漂亮以后就用这套了 。
|
76
cst4you 2016-12-30 10:54:11 +08:00
看成了 ADUI
|
77
takeoffyoung 2016-12-30 11:33:23 +08:00
已 star
|
78
Email 2016-12-30 11:42:23 +08:00
虽然不是前端工程师 但是要给个赞
|
79
baozijun 2016-12-30 11:42:57 +08:00
很是感谢,超级赞
|
80
daiv 2016-12-30 11:51:12 +08:00
还是感觉 layui 更适合一点,今天刚刚发现 layui
|
81
greenskinmonster 2016-12-30 11:57:59 +08:00
不得不说,确实挺厉害的。
|
82
Geeker 2016-12-30 12:20:40 +08:00
额,这和官方的感觉没什么区别啊,楼上的一群人难道都没看过官方的? https://getmdl.io/
|
83
wolfan 2016-12-30 12:28:47 +08:00
看着确实比官方的 MDL 方便点,而且也丰富不少,反正是图省事偷懒的好帮手啊~
|
84
wolfan 2016-12-30 12:33:41 +08:00
内啥,为什么俺这那个涟漪效果没有呐,试了好几遍了,没看到呐。
|
85
designer 2016-12-30 12:59:54 +08:00
已收录在创造狮-开发者框架
|
86
Pastsong 2016-12-30 13:03:55 +08:00
是我见过的 Web 框架里对规范实现最好的一版了
|
87
conglovely 2016-12-30 13:16:04 +08:00
棒棒哒,已 Star
|
89
zzutmebwd 2016-12-30 13:36:10 +08:00
很棒 感谢
|
90
rekulas 2016-12-30 13:38:36 +08:00
cool 感觉比 bootstrap 更有价值
|
91
exoticknight 2016-12-30 13:46:10 +08:00
赞啊但是涟漪效果没有?控制台没报错,看起来是没有了 mdui-ripple-wave 类?
|
92
tracymcladdy 2016-12-30 13:51:04 +08:00
真的好棒!
|
93
Nothentai 2016-12-30 13:52:58 +08:00
真的好棒_(:з」∠)_
|
94
forest520 2016-12-30 13:55:17 +08:00
很喜欢,感谢!
|
95
arzusyume 2016-12-30 13:56:21 +08:00
不晓得为啥我直接访问和挂代理访问, demo 页又拍云的资源都加载不出来
|
96
loveship 2016-12-30 13:57:12 +08:00 via Android
看起来还不错,但是每个类都加个 mdui...stupid
|
97
zdhxiong OP @exoticknight 涟漪效果只要一个 mdui-ripple 类就行。你用什么版本的浏览器看不到涟漪效果?
|
98
zdhxiong OP @arzusyume 你可以看下这个页面: http://pubstatic.b0.upaiyun.com/cdn-health.html 。看是不是你的网络问题
|
99
zdhxiong OP @loveship 加前缀可以避免和其他库混用时产生冲突,现在有不少主流框架(比如: purecss 、 Material Design Lite 、 amazeui 、 uikit 等)都是这么做的,个人认为还是有必要的。
|
100
iq72 2016-12-30 14:44:36 +08:00
|