随笔分类 - HTML5/CSS3
摘要:制作CSS3制作手风琴图片滑动效果,我们仅需利用CSS3的Transition属性和:hover 选择器简单几步就能完成该特效。
阅读全文
摘要:Drop-Shadow效果,其实就是大家熟悉的内容盒子阴影效果,在没有CSS3之前,大家都是通过Photoshop制作。而有了CSS3后,我们只需要利用box-shadow配合两个伪元素:before和:after即可实现。首先我们需要给内容盒子添加相对定位属性,然后给其添加两个伪元素 :before和:after ,在伪元素上添加绝对定位属性和z-index属性,将其定位到盒子的底部。
阅读全文
摘要:利用CSS3属性制作按钮,我们只需要用到Gradient属性,不用使用任何图片素材和JavaScript代码,仅仅通过CSS就能制作出好看的渐变按钮。按钮的大小可以通过CSS属性就能轻松的修改,而且它可以使用html的很多标签来制作,比如div,button,span,a,input[‘submit’]等等。
阅读全文
摘要:
前端时间学校刚学完Struts2-Action篇,又自学了一点AJAX/JQuery,到网上看了一些CSS3知识。突然想要不要干脆做一个用户注册与登入功能。下面是JAVA部分的核心代码, 如果这样的逻辑和大家想的很有出入的话,欢迎拍砖劈斧,呵呵。
阅读全文
摘要:
这是要结束了吗?是的,结束了。是不是很简单呢?等等,好像少了一点一样,哦,代码需要引入了Font Awesome矢量字体图标呢! 可这是什么东西呢?点击下面链接进行查看吧!
阅读全文
摘要:
好吧,结束了,是不是太简单了。那赶紧动手试试吧。如果嫌代码太粗糙的话,自己进行代码重构吧,Oh,My God! ,我刚才是不是用了一个非常专业性的技术词汇呢?! 好吧,你们赢了,如果实在接受不了这种“低奢内”的登入表单的话,我已经到网上找了一个“高大上”的CSS3登入表单和大家分享,可以点击这里查看哦:
阅读全文
摘要:
制作步骤:
一, 引入prefixfree.js脚本
下面代码中使用了CSS3无前缀脚本prefixfree.js,可以省去CSS3中前缀“-moz”、“-webkit”、“-o”、“-ms”,如对该脚本不了解的可以点击下面链接哦:CSS3无前缀脚本prefixfree.js与Animatable使用介绍,不过使用上还是略有出入,自己认真看看哦。
阅读全文
摘要:
下面代码中使用了CSS3无前缀脚本prefixfree.js,可以省去CSS3中前缀“-moz”、“-webkit”、“-o”、“-ms”,如对该脚本不了解的可以点击下面链接哦:CSS3无前缀脚本prefixfree.js与Animatable使用介绍
阅读全文
摘要:Font Awesome 为您提供了一套可缩放的字体矢量图标,可以快速自定义图标的大小,颜色,阴影,这些都可以通过CSS来实现,无需任何的JS代码哦。
阅读全文
摘要:现代浏览器基本支持CSS3,但是一些旧版本的浏览器还是需要添加前缀的。像box-shadow, border-radius这类属性,目前较新版本的浏览器都是不需要前缀的(包括IE9),但是,有些CSS3属性,例如渐变,前缀少不了,每次都需要像盖高楼一样堆叠CSS3代码。
阅读全文