css3 - 优设网 - 学设计上优设

菜单优设网 - 学设计上优设

会员

开通优设VIP星球

尊享13项VIP特权持续新增

主题打卡挑战

21天带练！告别无效练习

接私单赚外块

VIP优先接，累计金额超百万

优设私房课免费学

价值178元热销课程

你的私人律师

每月可免费咨询30次

开通VIP

领取更多设计师实用特权

投稿

css3 话题

五月干货！10个值得前端收藏的CSS3动效库（工具）

前端开发

五月干货！10个值得前端收藏的CSS3动效库（工具）

现在的网站和App的设计中越来越重视用户体验，而优秀的动效则能使你的应用更具交互性，从而吸引更多用户的使用。我一般会在网站中加入一些简单而一致的动效，我所用的技术则是用SASS+bourbon来生成出那些基于CSS3的动画效果来。但如果你对CSS3中定义动效还不熟练，或希望采用更加简单直接的方式在你的应用中引入动效的话，你可以参考并使用下面的这10个优秀动效库（工具）。

2016/05/01

建站福利！提供超多HTML5+CSS3响应式网页模版免费下载的酷站

酷站推荐

建站福利！提供超多HTML5+CSS3响应式网页模版免费下载的酷站

今天介绍的HTML5 UP! 提供大量的HTML5 模版，而且这些模版都支持响应式网页设计，有了它我们就不用从无到有、从头到尾来打造一个网站，而是直接就现有的样版去做修改或调整，让建网站难度降低许多，也减少花费的时间和开支。来收！因为自适应网页设计在开发上较为繁琐，一般很少免费提供下载的网站，但 HTML5 UP! 收录一系列共 28 种网页设计，通通都是 HTML5+CSS3 并有响应式设计功能，网站采用的授权方式为 Creative Commons 姓名标示 3.0，也就是说你可以自由分享、修改...

2016/02/23

潮流标配！20个九月最新的HTML5/CSS3优秀网站

酷站推荐

潮流标配！20个九月最新的HTML5/CSS3优秀网站

编者按：今天来一组酷炫的HTML5 – CSS3 优秀网站，无论是网站主题（反战、捍卫人权、肯德基老爷爷的美好晚年等）还是动效视觉，都非常值得体验。周末休息下，来点轻松的吧The Generations Relay2014年是华沙起义70周年，华沙博物馆邀请了在那场战斗有代表性的12个组织参加这个“薪火相传”的活动，组织里的年轻人庄严宣誓，他们将承担起建造一个自由、爱、诚实、谦虚、友善、保护弱者、有责任感的世界这个任务。Nike – Geç Kendini耐克2015年夏季的女装的互动体验网站，支持...

2015/09/19

前端人员必收！10个省时高效的CSS 3代码生成工具

下载

前端人员必收！10个省时高效的CSS 3代码生成工具

今天的资源是完全免费的 WebApp，这些 WebApp 能够为模板，渐变，甚至浏览器属性的前缀生成 CSS3 代码。如果你是前端开发者，这些资源可以帮助你节省很多时间，并可以为以后的项目提供可复用的源码。1. CSS3 GeneratorCSS3 Generator 是最受欢迎的用于代码生成的 web 应用之一。

2015/09/04

月中福利！献给网页设计师的HTML5/CSS3/JS便捷工具

教程

月中福利！献给网页设计师的HTML5/CSS3/JS便捷工具

是时候为网页设计师的来一组便捷的辅助工具了。日新月异的网页技术革新催生了大量的设计与开发工具，HTML5/CSS3几乎成了设网页设计师的必修课，而强大的JS也为网页提供了更多的可能性。尤其是HTML5，作为一门极为有用且实用的标记语言，它赋予网页设计师创造更优秀网页的可能。

2015/05/08

HTML 5能怎么玩？21个HTML5+CSS3酷炫网站帮你忙！

酷站推荐

HTML 5能怎么玩？21个HTML5+CSS3酷炫网站帮你忙！

编者按：HTML 5横空出世后，一直以炫目华丽的视觉特效震撼眼球，很多惊人的创意现在都可以轻松实现，今天我们搜集了21个独树一帜的HTML 5+ CSS 3 网站，亮出你的膝盖，接招吧 >>>H5 人气好文：《网页设计的优秀助攻！20款不容错过的HTML5工具》《5媚娘传奇！H5移动端页面设计心得分享（附案例解析）》TrippeoCommande en ligne NOURAFord AnswersHappy New YearEasy Rocket StudioSulliwan S...

2015/02/03

国庆干货第一波！20个实用便捷的CSS3工具、库及实例

前端开发

国庆干货第一波！20个实用便捷的CSS3工具、库及实例

编者按：坊间传闻，有本CSS的高手炼成秘籍在江湖失传已久，书中所载，多为最新的惊人技术与实例示范，是为集大成者，一旦学成，代码效率猛增，功力提升数倍，今日偶获，不敢怠慢，赶紧发到优设，望人人受益。说人话：好东西呀快来看呀！在本列表中，。

2014/09/29

轻松搞定动画！17个有趣实用的CSS 3悬停效果教程

前端开发

轻松搞定动画！17个有趣实用的CSS 3悬停效果教程

这里是我们收集的一些很有用的CSS 3悬停效果教程合集。HTML 5和CSS 3拓展了网页设计的可能性，它们引入了很多新属性来让你的网站变得丰富而饱满。在这篇文章中，我分享了18个CSS3悬停效果的教程，来让你的网站变得饱满并且传达更好的用户体验。

2014/08/31

这个比较高端了！CSS3动画帧数科学计算法

前端开发

这个比较高端了！CSS3动画帧数科学计算法

编者按：CSS3和HTML5一样是网页设计的大势所趋，本篇文章来自腾讯内部饭卡充值改版项目的CSS3动画经验总结。虽然大家访问不到腾讯内部的饭卡站点，不过可以由此小窥一下有趣的动画示例哟。bboy90：总结都浓缩在这个工具里了，想知道工具的地址或想窥探工具诞生的趣事请往下看。

2014/06/11

酷炫难挡！32个技术高超的CSS3网页设计欣赏

酷站推荐

酷炫难挡！32个技术高超的CSS3网页设计欣赏

现在大多数浏览器支持CSS 3 技术，因此许多大胆且富有创意的设计师开始学习运用它，有一大票童鞋已经在CSS 3 的路上高歌猛进，以下就是它们的作品，每一个都酷炫难挡，根本停不下来！酷炫合集：《超赞！HTML5游戏前端开发秘籍（附页面神器）》《想让网页更酷炫！

2014/05/17

适应网页设计新趋势：CSS3、字体以及图标

前端开发

适应网页设计新趋势：CSS3、字体以及图标

很荣幸从事网页设计业，新技术、新技巧越来越多，我们的工作越来越轻松，甚至不用设计软件，利用网上的一些工具都能完成设计。当然，若想更轻松的工作，就必须跟进新趋势、新方法，本文介绍了网页设计中一些新式设计方法。CSS3可以称得上是伟大，无论是开发者还是设计师都能从中受益。

2013/12/01

超赞！源自codepen的25个最受欢迎的HTML/CSS代码

前端开发

超赞！源自codepen的25个最受欢迎的HTML/CSS代码

Codepen是一个非常了不起的网站，优设哥在设计师网址导航上也大力推荐过，得到了很多同学的喜爱，也是全球web前端开发人员的圣地！我搜索了一些时下最好最流行的codepen（仅限于HTML和CSS）。如果你能把它们融入到设计中去，那么就会大大节省很多时间。

2013/11/26

20个网页设计师应该学习的CSS3经典教程实例

前端开发

20个网页设计师应该学习的CSS3经典教程实例

设计师千万不要总觉得CSS3还离我们特别遥远，其实如果你有兴趣的话，完全可以学习了解一些简单的CSS3技术。你知道的，国内的行情就是如此：所有的公司都会希望你在前端技术上懂的越多越好。那设计师学习前端代码是否就是天方夜谭呢？

2013/10/22

HTML5与CSS3基础教程

HTML5与CSS3基础教程第7版(含试读PDF下载)

图书推荐

HTML5与CSS3基础教程第7版(含试读PDF下载)

内容简介卡斯特罗、希斯洛普编著的《HTML5与CSS3基础教程（第7版）》是讲解HTML和CSS入门知识的经典畅销书，如今已经更新到第7版，介绍时下相当热门的HTML5和CSS3。虽然HTML5和CSS3还没有成为W3C的推荐标准，但主流浏览器已经能够很好地支持它们的大部分特性。《HTML5与CSS3基础教程（第7版）》不仅介绍了文本、图像、链接、列表、表格、表单、多媒体等网页元素，也介绍了如何为网页设计结构、布局，添加动态效果、格式化等形式，此外还涉及调试和发布、聚合和吸引访问等。

2013/08/01

HTML5与CSS3基础教程

图书推荐

HTML5与CSS3设计模式

图书描述出版日期: 2013年1月1日《HTML5与CSS3设计模式》是一部全面讲述用HTML5和CSS3设计网页的教程。书中含350个即时可用的模式（HTML5和CSS3代码片段），直接复制粘贴即可使用，更可以组合起来构建出无穷的解决方案。每个模式都可在所有主流Web浏览器中可靠地运行。

2013/07/16

最新出炉的20个CSS3特效打包下载（附特效预览+源码）

前端开发

最新出炉的20个CSS3特效打包下载（附特效预览+源码）

@榮榮-小黑_丫这些特效真的非常赞，本人已经体验并打包喽，大家也可以各取所需，按需下载。以下为17个网页CSS样式原件.zip 微盘下载地址→ http://t.cn/zTvTIdM1. Putting CSS Clip to Work : Expanding Overlay Effect教程地址 2. Flipping Circle Slideshow教程地址 3. 有创意的CSS加载动画教程地址 4.丰富多彩的CSS3动画导航菜单教程地址 5. 利用CSS3和jQuery实现照片集实时预览教...

2013/03/26

CSS3动画教程

Open Web新功能探索 - CSS3 Animations入门

神器推荐

Open Web新功能探索 - CSS3 Animations入门

Open Web新功能探索 - CSS3 Animations入门author:7yue注：编写CSS3 Animation的工具，Adobe Dreamweaver CS6和Adobe Edge Code（免费），可以通过注册Adobe Creative Cloud会员获取：http://t.cn/zY3vKy9CSS3已经成为当今Open Web技术环境下的开发者必然选择的一门技术，这些年从CSS2.1一路走来升级到全新版本的CSS3在各个技术公司和社区的合作下，也有了很多创新。CSS3 Ani...

2013/03/14

CSS3动画教程

2013年一二月最好的网站模版推荐

酷站推荐

2013年一二月最好的网站模版推荐

2013年一、二月份最好的网站模版热腾腾出炉啦——用HTML5、CSS3、JQuery创作的才华横溢、大受欢迎的作品。这儿有各种类型的模板—HTML5，单页HTML5模板，完全使用JS的模板，WORDPRESS主题，交互式模板，Bootstrap, Moto CMS, JS Animated, Joomla, Drupal, HTML Plus JS animated主题和Magento模板等。不管你是在找内容管理系统（CMS）模板还是商业模板，抑或交互式模板和javascript 动画模板，我们这...

2013/03/12

教程

让你的专题页面动起来

日常工作中会遇到很多的专题，在没有flash的支持下，如何让你的页面更生动呢？ CSS3不是新事物，CSS3动画也逐渐受到大家的关注，在机甲&洛克合作不删档放号专题中首次尝试了CSS3的简单动画制作。专题地址http://jjxf.qq.com/act/a20120907roco/，请使用chrome浏览器或者Firefox浏览器查看。

2013/02/13

不容错过的经典：CSS设计指南（第3版）

图书推荐

不容错过的经典：CSS设计指南（第3版）

书　　名《CSS设计指南（第3版）》系列书名图灵程序设计丛书印刷方式黑白原书书名 Stylin' with CSS: A Designer's Guide (3rd Edition) 原书书号978-0321858474原书国家美国原书出版社New Riders原书页数320李松峰：“我以七年翻译它三个版本的经验负责地告诉你：这是学习CSS绝对不容错过的经典。”第3版仍就延续之前的写作风格和特色，按技术主题分类，以实例辅助讲解的组织方式平易朴实、通俗易懂，内容上包括了CSS3以及用圆角、阴影、渐变、...

2012/12/15

没有更多内容了

大家都在看

干货

文章 154

配色

文章 231

用户体验设计

文章 337

UI

文章 147

ps技巧

文章 643

入门

文章 162

图标设计

文章 252

设计史

文章 152

设计师专访

文章 149

热门频道

设计专题

热门设计知识精挑细选

细节猎人

1分钟小短文揣摩设计真谛

优设读报

行业资讯一站知晓

优设琅琊榜

顶尖设计作品聚集地

优设9图

优设爆火的干货频道

设计问答

高手大咖在线答疑解惑

热门频道

设计灵感

支持与服务

优设微博

@
优秀网页设计
380W粉丝！每日更新设计干货
@
优设
强烈推荐！优设官方品牌微博
@
优优教程网
官方微博，海量教程看不完
@
优设基础训练营
零基础入门，带你成为软件高手
官方群
优设官方微信群
01优设25+设计师交流群
02优设30+设计师交流群
03优设求职招聘群
04优设同城交友群
05优设私单群
06优设学生交流群

07优设UI设计师交流群
08优设插画师交流群
09优设平面品牌设计师交流群
10优设3D设计师交流群
11优优教程自学团
12优设VIP知识星球交流群
微信扫码添加管理员招财

微信号：扫码添加

严格审核打造高质量交流群

进群会有面试题谢绝打广告
优设微信

每天官微五分钟

一年萌新变大神

扫码关注

1000W

优设新媒体矩阵等你来关注

优优教程网

优设大课堂

设计师导航

优设训练营