自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

网页特效,css样式

网页特效,css样式

原创 CSS3动画遮罩文字特效

CSS3动画遮罩特效,当你把鼠标放在图片上的时候,可看到图片上出现动态效果的文字提示效果,不要以为使用了JavaScript生成了本效果,其实它是用CSS3技术实现的页面动画,虽然没有那么流畅,但用CSS来实现,已经很难得了。

2015-07-13 12:55:55 2856 0

原创 CSS3文字立体效果

很棒的CSS3文字立体效果,用鼠标选中文字,效果更清淅,CSS3的功能真的很强大,总能制作出一些令人吃惊的效果,支持css3,大家看效果的时候请使用其它的浏览器啊,比如火狐或Opera等,IE8没效果。

2015-07-12 12:58:11 3617 0

原创 css3进度条

css3不可反向的进度条,超形象有立体感觉的进度条,而且修饰成了圆角,看上去挺漂亮,CSS3代码,欢迎参考。

2015-07-11 12:57:31 1499 0

原创 使用transform和transition制作CSS3动画

CSS3动画效果,分享一款使用transform和 transition 制作的纯CSS3动画效果,很漂亮~,鼠标放在图片上,会有动画效果出现。只写了针对Chrome浏览器的兼容,其它浏览器未做测试,可能会暂不兼容其他浏览器,所以请大家尽量用Chrome查看效果。

2015-07-10 12:22:07 1053 0

原创 css3使用transform属性制作js弹性运动

css3使用transform属性制作js弹性运动,其实做这个效果和js的原理一样:就是控制位置和时间,但是不同的是css用transform的translate来控制,其实现的最终一把手是transition。

2015-07-09 13:23:57 2733 1

原创 css3三维动画菜单上下翻转

三维阴影效果的CSS3动画菜单,运用纯CSS3技术实现的菜单,好酷呀的菜单,那些阴影和圆角都是用CSS3实现的哦,没有使用图片修饰啊,学习CSS3的朋友,可不要错过本示例哦,希望大家喜欢。

2015-07-08 11:56:38 1540 0

原创 CSS3制作苹果手机的Message图标,超强大

采用CSS3技术实现的仿iPhone苹果手机的Message图标,暴牛超酷!期待大家借鉴。这也让我觉得CSS3真是一个好东西。

2015-07-07 12:23:11 1100 0

原创 CSS3制作精美的iphone电话图标,不使用图片

IPhone手机的图标,大家都知道,看上去很精致很酷,本效果使用CSS3技术仿制一个精美的iPhone图标(无使用任何的图片素材),很酷哦,当然,如果使用了图片,那就没什么意义了。

2015-07-06 12:24:44 1969 0

原创 CSS3制作W3cplus的关注面板

W3cplus第三版本皮肤更新好长一段时间了,早就想把站点上的一些CSS3效果分割成单独的案例出来,与大家分享,但受限于时间,今天抽空把页面底部面板效果整理出来了。首先这个效果是有原因的,因为这个效果是当初自己左拼右拼出来的一个效果,后来自我感觉还能接受。上线后也有很多同学问我是图片制作的吗?其实...

2015-07-05 12:11:15 621 0

原创 CSS3制作漂亮的3D表单

CSS3技术制作的漂亮3D表单,请注意,因用到CSS3技术,里面引用了某些字体,如果你的电脑中没有安装这些字体,那么将显示不出某些效果,请使用火狐、Chrome、Opera等浏览器测试是前提。

2015-07-04 13:02:09 1878 0

原创 css画电脑键盘

CSS键盘,闲着无聊,用CSS代码写个键盘,技术要求个人感觉不太高,只是繁琐一些,最终效果觉得还挺不错。

2015-07-03 14:16:59 1353 0

原创 36种漂亮的CSS3网页按钮Button样式,总有你喜欢的

本页面向大家展开了36种漂亮的网页Button按钮样式,各式各样的都有,适合不同的场合使用。CSS3技术的确非常强大,不过大家测试的时候不要使用IE8,因为IE8还没有完全支持css3,微软如此不屑CSS3,唉!请使用火狐或Safari或Google Chrome。

2015-07-02 12:37:46 4745 1

原创 CSS3制作Freebie标签

CSS3制作Freebie标签,其中最有亮点的是使用css3来实现斜线背景以及方格背景,然后就是使用@font-face来制作icon图标。原理简单,重要的是思路,以及这两种背景实现的细节。

2015-07-01 11:55:15 614 0

原创 Button UI Kit CSS3漂亮Button按钮

Button UI Kit CSS3漂亮Button按钮,将Button UI Kit的设计图转换成CSS3的DEMO,制作的方法也相对简单,主要用到了CSS3的渐变gradient 、阴影text-shadow和box-shadow、还有就是字体icon的制作@font-face。但话说回来,属...

2015-06-30 12:19:38 1185 0

原创 css3幻灯片换位效果

CSS3技术实现的幻灯片效果,图片换位效果,点击某一张幻灯图片,这张图片就会换位,动画效果,测试时候注意,不要使用IE8。本效果兼容以下浏览器:火狐、Chrome、Safari等。

2015-06-29 13:21:27 733 0

原创 CSS3绘制砖墙-没有用任何图片

css3绘制砖墙-没有用任何图片,CSS3真的很牛叉,用它可绘制很多的图案,而且都很实用,挺新鲜,本款是使用CSS3绘制砖墙,也挺不错。

2015-06-28 13:18:12 696 0

原创 CSS3绘图实例代码

CSS3绘图实例代码,请在火狐运行,css3的圆角形状,在经过transform处理之后,overflow属性hidden值的表现会出现不兼容,moz核心下正常,在webkit核心的浏览器下,hidden的区域始终是方块形状,无视圆角。

2015-06-27 12:51:53 948 0

原创 CSS3 3D旋转动画代码实例

CSS3 3D旋转动画代码实例,本CSS3特效主要使用的是Transform属性实现,它是“变型”的意思,值主要包括:旋转rotate,扭曲skew,缩放scale,移动translate以及矩阵变形matrix 。通过这个实例,你将会学会如何使用它实现css3 3D动画。

2015-06-26 12:39:26 1704 0

原创 CSS3绘制灰太狼动画,绝对精彩

使用CSS3技术绘制的灰太狼动画,绝对精彩,不过请不要使用IE浏览器查看,否则很失望,很多浏览器可以很好的支持CSS3,像火狐、Safari、Chrome等等,都可以查看本效果哦。

2015-06-25 12:07:20 971 0

原创 HTML5梦幻星空,可用作网页背景

HTML5特效展示,梦幻星空,由于使用了html5,请使用支持html5的浏览器查看,源码可以直接查看。严格来说是用了HTML5中的canvas,所以需要支持html5的浏览器(Chrome,Firefox, IE9+)。

2015-06-24 13:37:00 4520 0

原创 CSS3实现的立体按钮

这是一个CSS3效果,如果看不到立体效果,请选用火狐 、Chrome等浏览器,IE8下看不到效果的。CSS3逐渐流行,比传统CSS功能更加强,性能更高,期待与大家一起研究CSS3技术。CSS3实现立体按钮轻易而举的事情。

2015-06-23 13:35:16 2982 0

原创 CSS3感应鼠标背景闪烁和图片缩放效果

CSS3感应鼠标背景闪烁和图片缩放效果,一款超棒的CSS3特效,鼠标滑过增加一点动画效果,让网页飞起来,CSS3会助你一臂之力哦。

2015-06-22 13:32:21 1463 0

原创 纯CSS3实现的表单输入高亮效果

纯CSS3实现的网页表单输入高亮效果,不插入任何的JS代码,实现输入框高亮显示。这里使用fieldset固定表单,是个不错的主意。

2015-06-21 12:46:44 2038 0

原创 CSS3纵向的鼠标移到图片图片滚动,图文菜单代码

CSS3图片滚动菜单,纵向垂直滚动,鼠标移到图片上之后,根据鼠标的移动图片会跟随滚动,因使用CSS3的部分属性,所以本效果需要火狐或chrome内核的浏览器才能看到真正效果,希望学习CSS3技术的朋友们喜欢。

2015-06-20 13:00:39 1413 0

原创 纯CSS3实现动画不规则的tab标签切换代码

再次与大家分享一款CSS3特效,不规则带动画效果的TAB标签切换,如果没有CSs3技术,恐怕本款TAB需要借助图片来实现,现在有了CSS3技术,似乎一切充得简单多了,好好研究一下吧,绝对值得研究的技术。

2015-06-19 12:37:03 1841 0

原创 未知图片大小的自动水平和垂直居中方法

JS实现未知大小的图片在已知大小的容器中水平和垂直剧中,我觉得在写瀑布流布局的时候能用得上,和瀑布流觉得挺相似的效果,在关键点都加入了注释,确认对学习CSs是相当有价值的代码。为了演示快速,这里去掉了一些Li图片,需要时自己可以再多加几个li未知尺寸的图片看效果。

2015-06-18 11:37:55 1049 0

原创 CSS 文字上下颠倒显示

做网页时候,个别地方需要网页文字颠倒显示,垂直上下颠倒,有意思吧?代码兼容全系列浏览,兼容IE/火狐、Safari和Opera等,针对不同的浏览器都有对应的处理代码。

2015-06-17 12:10:49 5137 0

原创 CSS带箭头的DIV方框,自适应高度

请详细了解一下代码,好好研究下,虽然实现起来有些麻烦,不过样子挺让人喜欢,WEB2.0网站中常看到的方框风格,在些告诉喜欢的朋友,方框中的文字,可以动态显示,而且Div边框的高度是自适应的,可自动增加。

2015-06-16 13:25:31 1598 0

原创 CSS定义鼠标移上图片链接,出现边框效果

一个比较适合网站友情链接用的CSS图片链接和文字链接样式定义代码,图片样式简洁,鼠标移上后,图片链接出现边框,文字链接去掉了下划线,比较中庸,但放在网页上既简洁,又漂亮,特别是用在网站底部的时候,我觉得各方面都不错的。

2015-06-15 12:58:26 3018 0

原创 CSS3立体智能手机开关,网页开关超酷效果

CSS3代码,测试请使用ie9,或火狐及Chrome等浏览器,立体开关效果是很多人喜欢的网页特效,现在好多的智能手机上见到比较多的效果,用CSs3来实现,代码要精简不少,用传统CSS也是可以实现的,只是比较麻烦一点。

2015-06-14 14:33:23 1197 0

原创 HTML5圆角框的一个“通知公告”页面

运用CSS3技术写了一个简单的公告通知页面,发现在火狐下是最简单就能实现圆角框的,代码现在发上来吧,用IE9以下版本的用户要悲剧了,推荐使用火狐和Chrome等浏览器。或许在不久在将来,基于CSS3为核心的HTML5将大范围得到兼容支持。

2015-06-13 12:29:01 7319 0

原创 纯CSS实现小圆点和三角形图案

运用所学的CSS技术,制作各种方向的网页小三角,还有小圆点的功能,小圆点的控制比较方便,可以用font-size控制圆点的大小,小三角是基于网页的特殊符号“◆”用CSS控制边角实现,也是挺实用的,现此将完整的代码分享给大家,也希望高人们能找到更简单有效的方法。

2015-06-12 14:06:47 8238 0

原创 CSS3 transform实现图片投影效果

纯css3打造投影效果——使用CSS3的transform属性实现的网页图片特效,除了ie9以下的浏览器,其他浏览器用户都可看到效果。在Safari下也有完美表现。

2015-06-11 15:51:33 2670 0

原创 9种样式CSS3 渐变按钮集

一款多风格、多样式的CSS3 3D渐变按钮,一共有9款不同的颜色风格,未使用任何的JS代码和图片,即使在不支持CSS3的IE8浏览器中,虽然看不到3D和按钮背景效果,但按钮的颜色渐变效果同样是十分漂亮的,鼠标移到按钮上后,按钮变色、显示出不同纹理的背景,非使用图片,完全CSS3代码生成。

2015-06-10 12:32:09 3396 0

原创 CSS多种方法实现分隔线

代码中演示了几种用CSS实现分隔线的方法,有的是使用单标签实现,有的是使用颜色搭配来实现,有的则是使用inline-block实现,或者用浮动来实现,当然也可直接用字符来现,具体选用哪一种方法,就看你的爱好了,仁者见仁,智者见智。

2015-06-09 15:28:13 1194 0

原创 css3 shadow实现的各种漂亮阴影效果

css3 shadow按钮阴影效果Demo代码,很多漂亮的纯CSS3实现图片的各种阴影效果代码,而且按钮的背景色处理的也挺个性,看上去很舒服,阴影的各类也挺多,下阴影、弧线阴影、立体阴影等,相信有一款是你需要的。

2015-06-08 14:48:57 7398 2

原创 CSS3实现各种格子纹理效果

一款实用的CSS3网页特效,实现了多种网页上使用率较高的纹理图案效果,用做网页背景超不错。这些纹理不使用任何图片做修饰,完全纯CSS3代码生成。有横格、竖格、斜格、棋盘等纹理背景。不落伍,就赶快学习CSS3吧。

2015-06-07 13:55:50 3887 0

原创 鼠标放上去Div旋转特效代码

这是一个CSS3特效,IE下看不到效果。一个Div方框,在CSS3代码的作用下,只要把鼠标移上Div方框,方框就自动顺时针旋转。代码量不大,甚至有些简单,作为一个基础的CSS3实例,我想还是比较不错的,有一定参考价值。

2015-06-06 13:37:17 2627 0

原创 css3 jQuery实现3d搜索框+为空判断

CSS3实现一个漂亮的搜索框,当用户没有输入内容的时候,点击提交按钮会出现一个漂亮的提示框。运行效果时请注意:如果右下角提示JS错误,请刷新一下页面或按“F5””即可。适用浏览器:FireFox、Chrome、Safari、Opera、傲游、搜狗. 不支持IE8、360极速浏览器等。

2015-06-05 13:10:14 923 0

原创 CSS实现鼠标放图片上显示白色边框+文字描述

CSS实现鼠标放图片上显示白色边框+文字描述,鼠标悬停在图片上的时候,图片显示边框,其它图片变暗,并在图片边框内显示图片描述信息,在网上见到过的效果,再此将代码与大家分享吧。

2015-06-04 14:52:31 2549 1

提示
确定要删除当前文章?
取消 删除