CSS3制作下拉菜单
导航菜单其实是没有什么可说的，制作方法到处可见，今天这个案例本来不只是一个导航，还有一个搜索表单的，可是为了偷懒，把搜索表单部分去掉了，就变成了一个CSS3制作的下拉菜单。在这个导航中主要两点，一个是渐变运用，另一个就是box-shodow制作的立体效果。HTML 结构：<ul id="nav...
tween.js是一款可生成平滑动画效果的js动画库。tween.js允许你以平滑的方式修改元素的属性值。它可以通过设置生成各种类似CSS3的动画效果。
简要教程tween.js是一款可生成平滑动画效果的js动画库。相关的动画库插件还有：snabbt.js 强大的jQuery动画库插件和Tweene-超级强大的jQuery动画代理插件。tween.js允许你以平滑的方式修改元素的属性值。你只需要告诉tween你想修改什么值，以及动画结束时它的最终值是...
Css3渐变实例Demo（一）
1.指定渐变背景的大小.div { background: url(../img/1.jpg); /*background-size:contain;*/ width: 500px; height: 100px;}.divOne { width: 100%; he...
css3中的变形（transform）、过渡(transtion)、动画(animation)
Transform字面上就是变形，改变的意思。在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate以及矩阵变形matrix。下面我们一起来看看CSS3中transform的旋转rotate、扭曲skew、缩放scale和移动trans...
css3 2D变形（transform）移动、缩放、旋转、倾斜
一. translate(x,y) 或者translateX(x)或者translateY(y)注意点：translateX(x)和translateY(y)大写X和Y；只写一个值，默认y=0。<body> <div></div></body> ...
8款超酷体验的jQuery/CSS3应用插件
1、jQuery/CSS3实现Android Dock菜单效果这是一款基于jQuery和CSS3的Android Dock菜单效果，点击底部的按钮即可让应用图标浮动上来，并且按钮也出现3D的翻转效果。jQuery是一款应用十分广泛的javascript类库，很多前端开发者都十分青睐jQuery框架。...
关于css3的rgba
在rgba之前，我们应该知道rgb。它就是红色R+绿色G+蓝色B。那rgba是什么？简单的说就是在rgb的基础之上加上一个通道alpha。他的语法如下：r 红色值。正整数(0~255) | 百分数g 绿色值。正整数 (0~255)| 百分数b 蓝色值。正整数 (0~255)| 百分数a...
css3中有哪些伪类？
:hover：用于选择鼠标悬停在元素上的状态。:active：用于选择被用户激活（点击）的元素。:focus：用于选择当前拥有焦点的元素（例如输入框）。:first-child：用于选择父元素的第一个子元素。:last-child：用于选择父元素的最后一个子元素。:nth-child(n)：用于选择...
番外篇-CSS3新增特性
CSS3是CSS的第三个版本，引入了许多新的特性和功能。以下是一些CSS3新增的特性： 1. 变换（Transform）：可以通过旋转、缩放、倾斜和平移等变换操作改变元素的外观和位置。 2. 过渡（Transition）：可以通过定义开始状态和结束状态之间的过渡效果，实现元素的平滑动画效果。 3. ...
CSS3鼠标滑过图片3D旋转动画
在线演示 本地下载...
基于jQuery和CSS3炫酷图片3D旋转幻灯片特效
在线预览 源码下载iPresenter是一款效果非常炫酷的jQuery和CSS3 3D旋转幻灯片特效插件。你可以使用它来制作产品展示、图片画廊或者各种幻灯片和轮播图特效。这款幻灯片插件的特点有：兼容jQuery。高度灵活和可定制性。灵活的用户界面的设计。在单个HTML页面中允许存在多个实例。可以...
使用CSS3的background-size优化Sprites图显示
当我的Sprites图像是300px,如何指定background-size为32px呢？其实不难，只需要一点点数学计算,这是一个很初级的过程。在我们的实例中,我们使用媒体社交图标.我想让他们都按16px x 16px的大小显示。我们将创建一个适合Retina屏幕设备的Sprites 图像，将图像尺...
CSS3如何实现图片上下左右居中显示
我来更新啦~这么久没更新你以为我是去忙啦？错！跟着男朋友去浪啦~最近遇到个问题，就是关于一张图片的故事，这个故事差点导致我分手，想知道嘛？我也不买关子，这就告诉你们，您！听好嘞！竹柏这么一打呀，是别滴咱不夸。我夸一夸，这微信朋友圈的图呀。这个微信朋友圈的图，它究竟好在哪？它是你情敌，你前任、你家人的...
【实战HTML5与CSS3】免费制作威客页面啦（附源码）
前言接着昨天的写，居然有圆友找到了网站原网址，这里也一并弄出来了，发现他们做出来其实和原型图还有一点差异呢：http://www.tmtpost.com/原型图今天我们要做的是这张图，我在威客上面找了好久，终于找到一张较合适的图呀，今天我们就来无偿奉献下吧，有图有真相，先上图吧！！这里也对自己提出要...
CSS3与页面布局学习总结（四）——页面布局大全
一、负边距与浮动布局1.1、负边距所谓的负边距就是margin取负值的情况，如margin:-100px，margin:-100%。当一个元素与另一个元素margi...
CSS3详解
1.什么是CSS css的优势 1、内容和表现分离 2、网页结构表现统一，可以实现复用 3、样式十分的丰富 4、建议使用独立于html的css文件 5、利用SE0,容易被搜索引擎收录！ CSS的几种导入方法 内部式 <style> h1{ co...
css3中的变形（transform）、过渡(transtion)、动画(animation)
Transform字面上就是变形，改变的意思。在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放scale和移动translate...
【CSS3 transform属性和过渡属性详解】
CSS3transform属性详解transform字面上就是变形，改变的意思。在CSS3中transform主要包括以下几种：旋转rotate、扭曲skew、缩放...
CSS3 实现动画慢慢升起和缓缓落下
本文主要介绍css3动画实现父容器慢慢升起和缓缓落下思路：1.先把静态样式写好2.给父容器添加样式transform: translateY(100%);这样就可以被隐藏起来，如果不生效，可以再加一下display:inline-block;可视区域最好在加一个overflow:hidden;体验更...
H5动效开发之CSS3动画
动画效果是情感设计的重要手段，在H5开发中，实现动效需要综合利用 JavaScript、CSS(3)、SVG、Canvas 等多种 Web 技术手段才能开发出动人的网页动态效果。 接下来，我们把重心放在 CSS3 动画上面，因为 CSS3 在现如今的网页动效开发中占据着最为重要的一席，作为老大哥 C...