卡卡网

我们都知道文件输入框(File Input)在自定义方面非常有限，本教程将指导你完成构建 jQuery 插件的过程，使用jQuery、CSS3自定义文件输入框(File Input)。

要将渐变叠加添加到文本元素，我们需要为要设置样式的文本设置三个不同的 CSS 属性。

本文给大家介绍16款精美的CSS3动画按钮，鼠标移到按钮上，按钮有动画效果。

有的情况，提交表单需要多个步骤来完成，很多人是通过页面转换来是实现过程设计，其实，我们可以在一个页面就完成这个功能，正如本文介绍的，jQuery和CSS3实现有进度条的多步注册表单 。

在表单里加上浮动占位符(Placeholder)，这样的表单设计越来越多人使用了。本文就给大家介绍一个带有浮动占位符(Placeholder)和光亮按钮的登录表单。

弹出DIV层的设计在网页交互中常常用到，比如注册/登录表单，详细信息的显示等等。今天，我将分享一个常见的弹出DIV层的效果，是响应式的模式弹窗设计效果。

今天，我要介绍的是，一个非常漂亮的响应式导航栏设计，这个导航栏做得非常用心，哪怕一个边角，都是精雕细琢的精致设计。

现在的网页设计多是响应式的了，而菜单又是网页里用户交互最多的最醒目的一部分，因此这个设计往往就更重要。本文介绍一个简单却实用的响应式导航设计。

本文介绍几个常见的鼠标悬停效果。这几个效果比较相近，主要是当鼠标移到和移出按钮时，按钮边框颜色或阴影的变化效果。

当鼠标移到按钮上时，按钮边框出现过渡动画效果，这在现在的按钮交互设计中十分常见。本文将介绍6个CSS按钮边框过渡动画效果。

关闭图标不用小图片，只用CSS，就能轻松实现。本文将给大家介绍如何用CSS来实现一个关闭按钮图标（X）。

现在的网页设计中要求弹出窗口时，不再是普通的popup旧式弹窗了，本文将介绍 Bootstrap 3 & AngularJS 模态对话弹出窗口的设计。

本文介绍一个CSS按钮，它具有伸缩（鼠标悬停）效果，即是当鼠标放上时，按钮伸长，当鼠标移开后，按钮缩短。这个效果在很多网页上都挺常见的，它多用于“更多”的按钮设计上。

本文介绍7个按钮悬停效果，它们是由box-shadow实现的。

本文介绍CSS Wave 波浪效果，这效果在很多产品网页上使用，它给人的视觉效果确实很好。本实例实现的 Wave 波浪效果，无需用到图片，仅用了CSS来实现动画效果。

多数情况下，我们都不想用input file文件上传控件的默认样式，其实，我们可以很轻松的使用很少的代码，就能改变上传控件的默认样式。

文件上传按钮默认无样式，现在应该没有网页或UI设计人员会用默认的按钮了，本文就介绍如何实现上图的文件上传按钮。

默认的下拉菜单样式有点呆板，使用体验不是很好，因此，本文给大家介绍一个漂亮的CSS下拉菜单设计。

单选按钮(radio)在网页设计中非常常用，本文给大家介绍一个简单又漂亮的纯CSS单选按钮(radio)样式。

网页选项卡或标签（tabs），是在网页设计中不可缺少的部分。本文介绍一个用纯css实现的有过度效果的滑动选项卡或标签(slide tabs)。

关于CSS实现的时间线，本文介绍两个，纯CSS实现的响应式垂直时间线。

前面曾介绍过不少有关纯CSS实现文字样式的文章，本文继续介绍一个有点酷的彩色渐变描边文字效果，仍然是用纯CSS来实现。

在很多扁平网站上，尤其是那些单页的HTML5扁平网站，常常见到有飘动的线条色带（乐普线条画布），觉得很好看，视觉效果特别好，现在分享给大家。

这个星光动画背景，看起来挺酷的，在某些网站上可作为一个效果展示。难得的是，这动画是纯CSS3实现的，迁移十分方便，代码一拷就行。这里给大家分享一下。

本文介绍一个可缩进的侧栏导航菜单，使用纯CSS3实现。

本文介绍的HTML5图片上传程序，是有裁剪功能的，即是只上传裁剪的部分，而不是上传整张图片。

本文介绍一个很棒的 HTML5 文件上传表单，带有进度条和预览（在客户端），应用程序不需要 jQuery，全部用纯 HTML5 Javascript 制作。

我想你已经看过了各种带有效果的动画菜单（基于 jQuery 插件），本文介绍如何仅使用 CSS3（没有任何 javascript）重复相同的行为，在菜单中使用 CSS3 过渡（为元素设置动画）。

本文介绍如何创建很酷的 CSS3 模态弹出窗口（或框）。为了实现弹窗这样的效果，我们可以使用jQuery或Javascript。但是，事实证明，CSS3 也拥有制作模态窗口所需的所有工具。

本文将介绍CSS3实现的4种3D文字效果。代码很简单，效果很震撼。

垂直时间线可以讲述你公司的故事及其发展历程。你可以使用一点 CSS 就能在自己的网站上创建垂直时间线。本文介绍的是一个可以自适应的垂直时间线。

text-shadow运用好了，也能像photoshop一样制作出非常好的文字效果，下面我这里罗列出一些比较好看的实例。

在本教程中，我们将创建一个很酷的 CSS3 垂直菜单，带有漂亮的菜单项图标，点击主菜单项将打开子菜单。

svg中的<circle>元素，是用来绘制圆形的，本文介绍<circle>如何设置实线边框/虚线边框/无边框。

本文介绍如何使用画圆，并且文字写在圆中间，主要用到SVG技术。

网页或UI设计时，有时需要把文字竖向排布，这个要怎么实现呢？其实很简单，CSS很少的代码就能实现。

这篇文章主要是通过简单的实例，介绍如何使用CSS+SVG实现环形或圆环文字效果。

用纯CSS实现环形文字效果，相比用CSS实现其他文字效果要复杂一些，本文介绍如何用纯CSS实现环形文字效果。

一些我们惯常用图片制作出来的效果，也许用CSS3几行代码就能实现，正如本文介绍的，使用css就能轻松实现文字投影/描边/浮雕/剪纸/发光等效果。

表单的标签在输入框里，当点击输入框时，标签浮动到输入框的上方。本文介绍如何使用纯CSS来实现这个效果。

前面介绍过《使用CSS创建的霓虹灯效果/发光效果文本》，今天再介绍如何使用纯CSS实现文字渐变和文字扫光动画效果。

网页弹窗功能很常见，但一般是使用Javascript或jQuery来实现，而本文要介绍的是，使用纯CSS也能实现弹窗功能，不用JS。

前面文章介绍过《CSS实现：固定Table表头和第一列》，今天介绍一下，如何用CSS实现：固定Table表头和表脚。

与 JS 制作 Charts 图相比，使用纯 CSS 制作 Charts 图，不需要渲染，所以性能得到了提升。本文就介绍利用一个CSS框架，制作各种Charts图的方法。

今天给大家分享一些漂亮的CSS渐变按钮，鼠标滑过(hover)后有动画效果，这些按钮UI设计，在很多网站上都使用着，让交互瞬间变得不再呆板。

本文介绍如何使用CSS实现文字颜色渐变效果。

CSS 中的cursor属性控制鼠标光标位于设置此属性的元素上时的外观。它们主要用于用户体验，以传达某些功能的想法。本文介绍CSS的32个鼠标形状cursor属性。 

CSS有很多长度单位，但不是任何一个单位都适合用于任何设计上。本文将介绍CSS的15个长度单位使用区别。

在 CSS 中，可以使用各种度量单位指定元素的大小或长度，如PX、EM、REM、%、VW 和 VH等，不过也许你还不十分了解，这些单位之间有什么区别？什么情况下该用什么单位？

本文介绍如何用CSS让内容(如div/table/图片等)显示在网页body中间。