阅读更多

15顶
1踩

Web前端
前端是网站和Web应用所呈现给用户最直接的东西,前端的好坏直接影响用户的体验和好感。尽管如此,你也不必为前端设计绞尽脑汁,因为有大量可重用的效果和代码来帮助你完成这一设计。

本文所介绍的这些效果都已经托管在CodePen网站上,点击下面的标题即可浏览代码和预览效果,并可以根据实际所需直观地进行修改。

1.  网站提示向导



2.  文本动画



3.  控制台UI



4.  CSS3仿制的Apple官网导航



5.  纯CSS3加载动画



6.  CSS另类加载动画



7.  提交按钮动画



8.  响应式扁平化UI



9.  面包屑导航组件



10.  基于CSS3的文字斑马行效果



11.  彩虹导航菜单



12.  CSS3制作的价格表



13.  平滑折叠菜单效果



14.  音量调节钮UI



15.  选项卡式的电子名片



16.  自定义多选框 & 单选钮



17.  超酷的文字阴影



18.  列表/网格视图切换器



19.  CSS3电子名片



20.  冬季主题网站布局



21.  视差滚动布局



22.  CSS图书动画



23.  可排序的任务清单



24.  CSS3绘制的树枝



25.  简单的博客编辑器



26.  CSS3开关



27.  登录表单



28.  HTML5/CSS3打造的指标滑块



29.  简单漂亮的CSS3按钮



30.  动画形式的表单



Via designwoop
  • 大小: 12.7 KB
  • 大小: 4.5 KB
  • 大小: 16.1 KB
  • 大小: 6.4 KB
  • 大小: 5.9 KB
  • 大小: 4.2 KB
  • 大小: 7.6 KB
  • 大小: 20.6 KB
  • 大小: 11.1 KB
  • 大小: 64.5 KB
  • 大小: 4.6 KB
  • 大小: 30.1 KB
  • 大小: 13.3 KB
  • 大小: 11.7 KB
  • 大小: 18.4 KB
  • 大小: 7.1 KB
  • 大小: 28 KB
  • 大小: 65.2 KB
  • 大小: 31.9 KB
  • 大小: 60.3 KB
  • 大小: 40.8 KB
  • 大小: 11.3 KB
  • 大小: 18.3 KB
  • 大小: 31.5 KB
  • 大小: 16.3 KB
  • 大小: 3.7 KB
  • 大小: 14.3 KB
  • 大小: 12.9 KB
  • 大小: 13 KB
  • 大小: 23.6 KB
15
1
评论 共 8 条 请登录后发表评论
8 楼 lody 2017-04-24 10:29
7 楼 lody 2017-04-24 10:28
6 楼 coosummer 2015-10-27 14:48
推荐使用http://buttoncssgenerator.com ,可以生成各种效果的按钮css,包括圆角、渐进颜色、阴影,并兼容各大主流浏览器
5 楼 一头狼 2014-02-13 13:44
mark....
4 楼 卟羡繁华 2014-01-06 16:54
是bootstrap做的?
3 楼 smallXiaoTi 2014-01-04 01:24
楼主好东西啊 我ding你啊 ddddd赞赞32个
2 楼 smallXiaoTi 2014-01-04 01:20
这玩意 ie打开有问题你怎么不早说呢???
1 楼 smallXiaoTi 2014-01-04 01:14
  正在探索怎么用它呢

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • 【软考】信息系统开发基础 - 信息系统生命周期模型(软件开发模型)

    不属于信息系统项目的生命周期模型。在考试论文中如何应用这个内容(一般都是说瀑布模型,或者是原型化模型的开发方法)

  • 软件工程概述-----RUP开发模式

    先启阶段末是第一个重要的项目里程碑,即生命周期目标里程碑。– 对是否已经获得正确的需求集达成一致意见,并且对这些需求的理解是共同。– 建立一个已确定基线的构架,它是通过处理构架方面重要的场景得到的,这。– 制作产品质量构件的演进式原型,也可能同时制作一个或多个可放弃的探索。完成开发所需的成本和进度。从简单快速的低风险运作转移到高成本、高风险的运作,并且在组织结构方。– 证明已建立基线的构架将在适当时间、以合理的成本支持系统需求。– 与部署相关的工程,例如接入、商业包装和生产、销售介绍、现场人。

  • 详细描述三个适于瀑布模型的项目_软件开发模型有哪些?

    软件开发模型大体上可分为两种类型,第一种是以软件需求完全确定为前提的瀑布模型。 第二种是在软件开发初始阶段只能提供基本需求时采用的渐进式开发模型,如原型模型、螺 旋模型等。实践中经常将几种模型组合使用以便充分利用各种模型的优点。1.瀑布模型瀑布模型也称软件生存周期模型,由 W.Royce 于 1970 年首先提出。根据软件生存周 期各个阶段的任务,瀑布模型从系统需求分析开始,逐步进行阶段性变换,直...

  • RUP优缺点

    <br />RUP的优点 <br />1. RUP是建立在非常优秀的软件工程原则基础上的,例如迭代,需求驱动,基于结构化的过程开发。 <br />2. RUP提供了几个方法,例如每一次迭代产生一个工作原型,在每一个阶段的结束决定项目是否继续,这些方法提供了对开发过程的非常直观的管理。 <br />3. rational公司已经并将继续对RUP进行开发,使这个基于html的软件工程能够被裁减以适合你的组织的实际需要。 <br />RUP的缺点 <br />1. RUP仅仅包含了开发过程。它没有完全覆盖软件过程

  • 瀑布模型与“V”模式开发模型有何异同?

    在做软件开发时,程序员们肯定接触过各式各样的软件开发模型,例如:写了再改模型、瀑布模型、增量模型等。其实,很多开发模型是在瀑布模型基础上衍生出来的。 然而,了解“V”模式开发模型的程序员应该不多。“V”模式开发模型是汽车电子行业在瀑布模型的基础上做了改进,以符合汽车ECU开发需要的模型。 今天来讲讲瀑布模型与“V”模式开发模型的异同。 瀑布模型 瀑布模型产生的历史背景是20世界70年代出现的软件危...

  • 软件开发中的瀑布模型

    软件开发的流程 软件开发的流程有很多种模型,这里讲的一种软件开发的流程是瀑布模型     瀑布模型是将软件生存周期的各项活动规定为固定顺序的若干阶段工作,最终得到软件产品。 他的核心思想是按工序将问题化繁为简,便于分工协作,采用结构化的分析与设计方法将逻辑实现 与物理实现分开。 瀑布模型的几个阶段如下: 一、问题定义    软件要解决什么问题,做什么。例如:做类似京东的购物网站,

  • RUP简介

    RUP简介           一、   RUP的概念           RUP(Rational Unified Process,统一软件开发过程,统一软件过程)是一个面向对象且基于网络的程序开发方法论。           瑞理统一过程(RUP)是Rational软件公司(Rational公司被IBM并购)创造的软件工程方法。RUP描述了如何有效地利用商业的可靠的方法开发和部署

  • 常用软件过程——RUP

    RUP是用例驱动,以架构为中心,迭代式开发过程。 一、用例驱动 用例(Use Case)是一种通过用户的使用场景获得需求的技术。区别于传统的功能分解获取需求的办法,用例方法强调用户是如何使用系统的,即描述用户与系统之间的交互,而不涉及系统内部的行为。用例的一般表示法是UML用例图。 用例方法的主要特点有: 需求表述的抽象性。用例方法以UML用例图的形式表示,对于用例、参与者...

  • 瀑布模型原型模型迭代模型螺旋模型的适用场景

    在前期需求明确的情况下尽量采用瀑布模型或改进型的瀑布模型,在用户无信息系统使用经验分析人员技能不足的情况下一定要借助原型。在不确定性因素很多,难以提前估计和计划的情况下尽量采用迭代和螺旋模型。在技术难度较大,内容复杂的情况下采用进化迭代和螺旋模型。 ...

  • 软件开发模型

    软件开发模型 软件开发模型(Software Development Model)是指软件开发全部过程、活动和任务的结构框架。软件开发包括需求、设计、编码和测试等阶段,有时也包括维护阶段。软件开发模型能清晰、直观地表达软件开发全过程,明确规定了要完成的主要活动和任务,用来作为软件项目工作的基础。对于不同的软件系统,可以采用不同的开发方法、使用不同的程序设计语言以及各种不同技能的人员参与工作、运用不同的管理方法和手段等,以及允许采用不同的软件工具和不同的软件工程环境。 软件工程的主要环节包括人员管理、项目管理

  • 几种常见的软件开发模型:瀑布模型,快速原型模型、增量模型、螺旋模型、喷泉模型

    ** 瀑布模型 ** **瀑布模型是20世纪80年代之前最受推崇的软件开发模型,它是一种线性的开发模型,具有不可回溯性。**开发人员必须等前一阶段的任务完成后,才能开始后一阶段的工作,并且前一阶段的输出往往就是后一阶段的输入。**由于它的不可回溯性,如果在软件生存周期的后期发现并改正前期的错误,那么需要付出很高的代价。传统的瀑布模型是文档驱动的:需求分析→设计→编码与单元测试→集成与系统测试→运行...

  • UML 学习二

    UML软件工程组织 一:UML定义了5类,10种模型图 UML提供的基本模型图包括: (1)、用例图:展示系统外部的各类执行者与系统提供的各种用例之间的关系 (2)、类图:展示系统中类的静态结构(类是指具有相同属性和行为的对象,类图用来描述系统中各种类之间的静态结构) (3)、对象图:是类图的一种实例化图(对象图是对类图的一种实例化) (4)、包图:是一种分组机制。在UML1.1版...

  • 瀑布模型

    瀑布模型(Waterfall Model) 是一个项目开发架构,开发过程是通过设计一系列阶段顺序展开的,从系统需求分析开始直到产品发布和维护,每个阶段都会产生循环反馈,因此,如果有信息未被覆盖或者发现了问题,那么最好 “返回”上一个阶段并进行适当的修改,项目开发进程从一个阶段“流动”到下一个阶段,这也是瀑布模型名称的由来。包括软件工程开发、企业项目开发、产品生产以及市场销售等构造瀑布模型。

  • 软件工程----------第一章小测验

    一、单选题 1软件是一种( )。 A、 程序 B、 数据 C、 逻辑产品 D、 物理产品 我的答案:C 2瀑布模型突出的缺点是不适应( )的变动。 A、 算法 B、 程序语言 C、 平台 D、 用户需求 我的答案:D 3快速原型的主要优点不包括( )。 A、 能让用户参与开发、给出反馈 B、 尽早把需求分析清楚,以降低风险 C、 尽早地发现问题、纠正错误 D、 对软件分析设计人员的素质要求不高 我...

  • 【软件工程】RUP与软件开发5大模型

    软件开发的5大模型 1.瀑布模型:按照人的思维一步一步的开发下去,如果需求分析得当,每个阶段顺利,结果还不错! 2.快速原型模型:后来人们发现,自己不可能一下子就把所有的需求搞清楚,总是在开发的过程中,用户不断完善自己的需求,导致当使用瀑布模型的时候,很容易做的好好的,又要重新开始,这就很气人,所以,人们干脆就不用瀑布模型,另辟蹊径,采用先快速的给用户看到一个样子,然后接着开发,开发一段时...

  • 软件工程 瀑布模型、原型模型、喷泉模型和V模型的优缺点及适用场景

    一、瀑布模型   瀑布模型(Waterfall Model)是一个项目开发架构,开发过程是通过设计一系列阶段顺序展开的,从系统需求分析开始直到产品发布和维护,每个阶段都会产生循环反馈,因此,如果有信息未被覆盖或者发现了问题,那么最好“返回”上一个阶段并进行适当的修改,项目开发进程从一个阶段“流动”到下一个阶段,这也是瀑布模型名称的由来。包括软件工程开发、企业项目开发、产品生产以及市场销售等构造瀑布模型。   瀑布模型也称软件生存周期模型。它在软件工程中占有重要地位,它提供了软件开发的基本框架,这比依靠“个

  • 软件产品的敏捷开发方法总结

    敏捷开发以用户的需求进化为核心,采用迭代、循序渐进的方法进行软件开发。在敏捷开发中,软件项目在构建初期被切分成多个子项目,各个子项目的成果都经过测试,具备可视、可集成和可运行使用的特征。换言之,就是把一个大项目分为多个相互联系,但也可独立运行的小项目,并分别完成,在此过程中软件一直处于可使用状态。核心思想总结如下: ◆简单化 当从事开发工作时,主张最简单的解决方案就是最好的解决方案。不必要对这...

Global site tag (gtag.js) - Google Analytics