CSS3语法及选择器总结-一.CSS的引用
方式一:内部样式表(HTML中引用) 在HTML的title标签下方添加style双标签，style标签里面书写CSS *style里面的注释为/ * … / CSS的书写规则: 选择器{属性名：属性值；} 代码示例 <!DOCTYPE html><html lang="e...
前端理论总结（css3）——link/import区别 // 伪类/伪元素
伪类/伪元素 1： 伪类使用1个冒号，常见的有：:hover，:link，:active，:target，:not()，:focus等 伪元素使用 2 个冒号，常见的有：::before，::after，::first-line，::first-le...
前端理论总结（css3）——css动画与js动画区别 // 选择器/优先级
一、 css动画与js动画区别 1：js是逐帧动画，css是补间动画。 2：js动画控制能力很强可以在动画播放过程中对动画进行控制：开始、暂停、回放、终止、取消都是可以做到的 3：js动画使用CPU运算，会阻塞，css动画使用gpu运算，不会阻塞 4：...
12款非常精致的免费 HTML5 & CSS3 网站模板
01. Joefrey Mahusay很炫的单页网站模板，基于 HTML5 & CSS3 制作，适合用于设计师个人简历、摄影师和平面设计师的个人作品展示。演示 下载02. FolderFolder是一款响应式 HTML5 网站模板，能够自适应各种设备和浏览器尺寸。适合用于创意展示和企业网站...
CSS3之动画模块实现云朵漂浮效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>动画模块-云层效果</title> <style> * { ...
前端理论总结（css3）——css优化的方法
1：首推的是合并css文件，如果页面加载10个css文件，每个文件1k，那么也要比只加载一个100k的css文件慢 2：减少css嵌套，最好不要套三层以上 3：不要在ID选择器前面进行嵌套，ID本来就是唯一的而且人家权值那么大，嵌套完全是浪费性能 4：建...
CSS3构建一个正方体
《专题技术文献》开发工具与关键技术：Adobe Dreamweaver CC 2017作者：落于的天_萧瑟撰写时间：2019.1.18一、 网页小图标首先创建一个标签，在rel 属性中添加 icon 再在href属性中添加自己想...
用CSS3做一个图片翻牌效果
效果展示思路分析首先是两张图片应该是叠在一起的，然后要让他旋转的时候展示另一张图片。知识准备：transform变形，定位，还有backface-visibility，这后面说什么用的。1、先来搭建HTML结构需要两张图片，可以用自己喜欢的，结构也可以写的简单些。2、然后再来写下基础样式把父容器放在...
css3实现好看的边框效果
1、html结构<div class="box">box</div><br><div class="border1">border1</div><div class="border2">border2</div>&l...
CSS3做一个气泡的动画效果
来学习分享一下用CSS3做一个简单的气泡飘飘的动画效果1、首先来搭建一个基本HTML结构先来个10个div，这也就是我们的泡泡了。2、接下来进入css样式设置设置一下body，并给他一个合适的背景颜色，撑满整个屏幕，然后再来设置一下泡泡的样式了。给泡泡个固定定位，方便跑来跑去，预备一个泡泡动画3、再...
css3 2D动画的基本用法和介绍
<style> body{height:400px;border:1px solid #000;} .box{width:90px;height:30px;border:1px solid;border-radius:8px;background:linear-gradi...
CSS3 转换(Transform)
转换 transform能够对元素进行移动、缩放、转动、拉长或拉伸在CSS中，允许元素实现 2D 和 3D的转换效果,主要包含 ：旋转，缩放，移动，倾斜 2D ：元素只能在X轴和Y轴平面上发生变化 3D ：元素还可以在 Z轴上发生变化取值：none：无转换2D Transf...
jQuery和css3实现的摩天轮旋转效果
分享一段代码实例，它实现了摩天轮旋转效果。效果是通过css3和jQuery实现，代码实例如下:0010020030040050060070080090100110120130140150160170180190200210220230240250260270280290300310320330340...
css3之动画
animation属性属性描述@keyframes 动画名动画关键帧animation动画的6个属性animation-name动画的名称animation-duration动画的周期时间animation-timing-function动画的速度曲线animation-delay动画的开始时间an...
Css3动画浏览器兼容问题
Css3动画属性浏览器兼容的写法在css发展的过程中，当一些新得css属性刚出来的时候，还没有成为业界认可的标准（有可能永远都不会成为标准），于是各个浏览器开发者选择采用一些用于自己测试的属性，这些属性只在自己所开发的浏览器上被支持，而在其他浏览器上不支持。于是这些属性前面都加上了独特的前缀。常见的...
HTML5与CSS3基础教程(第8版) PDF扫描版
《HTML5与CSS3基础教程(第8版)》自第1版至今，一直是讲解HTML和CSS入门知识的经典畅销书，全面系统地阐述HTML5和CSS3基础知识以及实际运用技术，通过大量实例深入浅出地分析了网页制作的方方面面。最新第8版不仅介绍了文本、图像、链接、列表、表格、表单等网页元素，还介绍了如何为网页设计...
用CSS3动画，让页面动起来
以前就听说过有个库，叫animate.css，但是自己并没有在实际项目中使用过，这次正好要做个招聘页面，得以利用一下这个库，在经常会卡顿的UC浏览器中也能流畅执行。扫描下面的二维码，可以看到在线的demo页面：如果对CSS3动画的一些基础概念不是很熟悉，可以参考《CSS3中的动画效果记录》。一、an...
纯CSS3写的10个不同的酷炫图片遮罩层效果【转】
这个是纯CSS3实现的的10个不同的酷炫图片遮罩层效果，可以欣赏一下在线预览下载地址实例代码123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051<!DOCTYP...
8个纯CSS3制作的动画应用及源码
对于一个复杂的图形或者动画来说，之前我们的处理方式是图片叠加或者利用CSS+JavaScript的方法，然而随着CSS3标准的不断成熟，我们甚至完全可以利用CSS3来绘制一些图片和制作丰富的动画特效。本文主要是分享了8个纯CSS3制作的动画应用，提供源代码下载。1、纯CSS3实现发光开关切换按钮前段...
纯CSS3写的10个不同的酷炫图片遮罩层效果
这个是纯CSS3实现的的10个不同的酷炫图片遮罩层效果，可以欣赏一下在线预览下载地址实例代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml...