archive.php

CSS border-radius 新玩法(含可视化生成工具)

这个 CSS 属性对于前端人员一定不陌生，一直以来都把它当作矩形圆角使用，然而，对于喜欢创新的设计师来说，这是不够的，我们要最大化利用 border-radius，让它玩得更出色。

先来看看截图[……]

阅读全文 »

CSS 或 srcset 让浏览器自动切换 1X/2X/3X 图像

现在很多客户都买高分屏的电脑，如果直接发 JPG 图给客户，会影响设计质量。为了让网站设计效果图更加真实，最近把设计提案直接做成 Web 版，模拟浏览器真实视觉效果，同时能自动识别是否为视网膜显示屏，[……]

阅读全文 »

小创意：圣诞球切换开关

还有几天就到圣诞节，几乎到哪里都能看到圣诞气氛的设计，网站也是如此，为了让网站页面更有气氛，我们不能放过任何小创意，即使是一个小小的切换开关元素。

大家请看下图，这是来自 Chris Ganno[……]

阅读全文 »

优化阅读体验，网站预设字体的CSS最佳写法

英文字体的文件大小比较小可以使用嵌入字体让网站展示更好，但中文就不一样了，文件大小是 MB 级别，为了 WEB 端性能，只好使用系统自带的默认字体，然而我们有 Windows 和 Mac  OS 两个[……]

阅读全文 »

这10个按钮，把 CSS HOVER 的创意发挥到极致了

CSS hover 样式很简单，但是想创造出有意思、实用、有创意性的特效是很考验设计师的创意能力，所以设计达人每隔一段时间都会分享一些与鼠标点击、悬停的相关特效，以便大家获得更好的创造灵感。[……]

阅读全文 »

bttn.css – 简单实用的按钮样式库

CSS 能实现很不多不同的样式，只有你想不到，没有做不到哦，今天为大家分享的 bttn.css 是一个专注分享网页按钮的样式库，设计师和前端人员可以参考这个设计，也能直接拿来使用。
bttn.css[……]

阅读全文 »

纯 CSS + 纯字符实现的 loading 加载效果

等待加载、加载中的在网页上是很常用的元素，实现方式也很多，其中直接用 GIF 动画、CSS sprites 等，而今天介绍的就是以纯 CSS + 纯字符实现的 loading加载效果，样式超级多，可选[……]

阅读全文 »

可视化 CSS 样式表手册 – css reference

前端开发新人一般是从 HTML 和 CSS 进行入门学习，在设计书籍导航里有一系列前端从入门到精通的书籍推荐，但是我们偶尔在线学习会更加方便，比如今天分享cssreference，它是一个专门介绍 CSS 样式表的在线网站[……]

阅读全文 »