学习CSS3已有一年半之久了,虽然说不上很懂,但对于一些基本的属性使用还是有一定的了解。时常在群里有很多同学在索取有没有好的CSS3书,CSS3教程。其实如今学习CSS3还是相当的方便,最起码比起一年前来说是好很多很多。今天我把w3cplus的一些有关于CSS3的基本教程整理了一下,希望对同学们学习有所帮助。
CSS3选择器
选择器对于玩CSS的人来说,并不陌生,但对于CSS3选择器的使用,我想还是有很多同学没有体验过。在这里给大家准备了几篇基础性的教程:
CSS3基本属性
CSS3涉及的新知识是非常的多,在学习笔记中我也是东一榔头西一棒的,大家在w3cplus找起相关资料也是不太方便,今天我也稍加整理了,把一些基础属性的相关教程罗列出来:
- 制作渐变图片:《CSS3 Gradient》
- 制作透明色:《CSS3 RGBA》
- 制作圆角:《CSS3 Border-radius》
- 制作文字阴影:《CSS3 Text-shadow》
- 制作盒子阴影:《CSS3 Box-shadow》
- 制作变形、移位、扭曲等效果:《CSS3 Transform》
- 制作动画平滑过渡效果:《CSS3 Transition》
- 制作动画效果:《CSS3 Animation》
- 控制边框颜色:《CSS3 Border-color》
- 制作图片边框:《CSS3 Border-image》
- 截取文本:《CSS3 Text-overflow》
- 控制文本断行效果:《CSS3 Word-wrap》
- 盒模型新概念:《CSS3 Box-sizing》
- 制作特殊字体:《CSS3 @font-face》
- 背景尺寸:《CSS3 Background-size》
- 背景裁剪:《CSS3 Background-clip》
- 背景原点:《CSS3 Background-origin》
- 制作多背景:《CSS3 Multiple Backgrounds》
- 多列属性之跨列:《CSS3 Multi-columns》
- 多列属性之列数与列宽:《CSS3 Multi-columns》
- 多列属性之列间距:《CSS3 Multi-columns》
- CSS媒体:《CSS3 Media Queries》
上面的教程还没有完全汲及所有CSS3的属性,不过感兴趣的同学可以先学习,我们将会在后期继续完善有关于CSS3方面的教程
CSS3相关方面案例
前两个都是理论,当然在教程中也附有不少的实例,但还不是很全面,在这一块上,我也整了部分相关的实例教程,希望大家喜欢:
- 《CSS3制作文字特效》
- 《CSS3 Gradient Buttons》
- 《CSS3制作Tabs选项卡》
- 《CSS3 Tips》
- 《CSS3制作Drop Shadow效果》
- 《CSS3 Ribbons》
- 《CSS3制作垂直手风琴》
- 《CSS3美化表格》
- 《CSS3动画集——Animate.css》
- 《CSS3制作Apple官网的Seach Box效果》
- 《CSS3制作超酷的SearchBox》
- 《玩转CSS3颜色》
- 《CSS3制作Progress Bars》
- 《CSS3制作日历》
- 《CSS3制作留言墙》
- 《CSS3制作Breadcrumbs》
- 《CSS3制作动画加载页面》
- 《CSS3制作分享按钮》
- 《CSS3制作3D分页导航》
- 《CSS3美化有序列表》
- 《CSS3制作iPhone的Checkbox》
- 《CSS3制作菜单的Hover效果》
- 《CSS3制作表单动态帮助信息》
- 《Pure CSS3 Ribbons》
- 《@font-face制作Web Icon》
- 《CSS3 Media Queries案例——Tee Gallery》
- 《CSS3 Media Queries案例——Hicksdesign》
- 《CSS3 Media Queries案例——A List Apart》
前面列出的是w3cplus有关于CSS3方面的属性教程和一些实例,如果大家对CSS3非常感兴趣的话,可以到W3cplus的DEMO站点学习或下载更多有关于CSS3方面的案例。
转载此文烦请注明出处:http://www.w3cplus.com