1
disinfeqt OP |
2
lianghai 2010-07-29 01:09:00 +08:00
哈,好可爱!只是感觉按下去之后的边框有点杂乱了,失去了原来状态下的平滑和锐利。
|
3
disinfeqt OP @lianghai 嗯 我只是截了一张图放到PSD里先模仿出来,以后会根据自己的理解和用途改进的。还好,一切都是CSS。
|
4
lianghai 2010-07-29 01:25:40 +08:00
|
5
lianghai 2010-07-29 01:32:50 +08:00
Dribbble 太可爱了!我刚刚才开始了解这个网站。400×300px 的限制就像 Twitter 的字数限制;月初恢复可用的展示额度很有意思。嗯,比 deviantART 更适合我。
|
6
Sai 2010-07-29 03:04:38 +08:00
稍稍尝试了一下
http://img.ly/1MlE |
9
Sai 2010-07-29 13:47:33 +08:00
话说这个btn样式可以把mobile safari里面那个巨丑的默认样式覆盖掉
|
11
Sai 2010-07-29 14:02:17 +08:00
@disinfeqt Pure CSS…… 详见这个登录按钮 http://bgm.tv/login
|
12
disinfeqt OP Now transforming buttons into anchors...
我才发现,用 a 来做要比 button 简单几百倍... 而 button 的实用性实在不高。 |
14
Sai 2010-07-29 14:25:21 +08:00
@disinfeqt
其实我做出了Mad Elements里面的质感,但是和网站风格太不搭调。 (你把 box shadow的0 1px 1px rgba(255, 255, 255, 0.4) inset, 0 -1px 0 rgba(255, 255, 255, 0.3) inset, 0 0 0 #0F3E75, 0 0 2px rgba(0, 0, 0, 0.5) 改成 0 1px 1px rgba(255, 255, 255, 0.4) inset, 0 -1px 0 rgba(255, 255, 255, 0.3) inset, 0 4px 0 #0F3E75, 0 0 2px rgba(0, 0, 0, 0.5) 就是那种质感了 用a的话submit让移动设备情何以堪 |
16
disinfeqt OP 哈哈,改进了 http://grab.by/5DVa
不知道各位能联想到什么?对!一会儿就来~ XD |
17
Livid MOD 好,期待看到。
|
18
disinfeqt OP 身为一个按钮,如果没有 http://www.zdxia.com/lab/text-selection.html 的话,鸭梨是很大的。
|
19
lianghai 2010-07-29 14:43:59 +08:00
想到了 Mac 的键盘……
|
20
dimlau 2010-07-29 15:10:07 +08:00
其实纯CSS的不见得有多好,从需求出发,一个按钮图片才多大?
纯CSS却(一般)要加很多不必要的盒子进去。 ⋯⋯好吧,我承认我blog里的RSS图标也是用纯CSS做的。 |
21
disinfeqt OP @dimlau NO redundant boxes outside / inside.
就是不喜欢用图片,实在是不够酷。 |
22
dimlau 2010-07-29 16:02:49 +08:00
呃⋯⋯
我的RSS标(思路从一国外大牛那里顺来的,修改了CSS),结构: <aside class="rss"><a href="atom.xml" title="订阅更新">RSS<q class="dot"></q><q class="inside ring"></q><q class="outside ring"></q></a></aside> CSS更是一大陀。酷到挺酷的,但是本来可以: <a href="atom.xml" title="订阅更新">RSS</a> CSS一句background搞定。 明显纯CSS不够简洁。 当然,你说的“就是不喜欢用图片”,理由也挺充分的,我RSS图标不用图片的理由也差不多——界面里如果能不用就不用图片。 |
23
Sai 2010-07-29 16:25:39 +08:00
这个还是需要取舍的,我们在研究这个不需要额外的box,而画feed ico需要这么多不必要的box,对IE用户也不友好。
|
24
disinfeqt OP 用CSS来画图是很蛋疼的行为,完全没有实用价值,我从来不用。
但是如果在一个 element 里展现出往往需要多个 elements 配合才能完成的效果,那是值得研究的,这就是为什么我花了一下下午的时间来摆弄这些玩意儿。 |
25
disinfeqt OP |
27
disinfeqt OP http://grab.by/5DYO
针对IE的 hack... 纯测试,代码未整理... |
28
brando 2010-07-29 16:43:14 +08:00
据我所知,小Sai同学做的页面基本上都很让我惊艳,多年前就是了,而且是个很了不得的人。重点是,年龄他还很小噢,很可爱...XD...LOOOOL
|
29
lianghai 2010-07-29 16:46:47 +08:00
@brando 求继续爆料!可以发在 http://v2ex.appspot.com/t/869 里面 XD
|
31
disinfeqt OP @Sai 哦 没看到你说无解,加一个 ::-moz-focus-inner{border:none;padding:0;}
|
32
disinfeqt OP 还有,在元素内加一个 -moz-outline-style:none;
|