随笔分类 -  CSS3

CSS3特效----图片动态提示效果
摘要：需掌握的知识点： 1.掌握两个HTML5新标签figure以及figcaption的用法 2.掌握transform的属性特点，并能熟练运用 3.学会通过transition及transform配合，制作动画 4.学会简单的媒体查询应用 figure ，HTML5语义化标签： 用于规定独立的流内容（ 阅读全文
posted @ 2017-02-14 16:06 Lovebugs.cn 阅读(1019) 评论(0) 推荐(0)
CSS3知识点整理（五）----响应式设计及其他属性
摘要：介绍Media Queries与Responsive设计以及外轮廓属性、resize属性、CSS3生成内容等 学会如何使用CSS3中的Media Queries模块来让一个页面适应不同的终端（或屏幕尺寸）。 （一）Media Queries 媒体类型 Media Queries是CSS3新增加的一个 阅读全文
posted @ 2017-02-14 09:30 Lovebugs.cn 阅读(461) 评论(0) 推荐(3)
CSS3特效----制作3D旋转照片展示区
摘要：任务一、制作多背景 提示：上层有一个径向渐变，渐变图像farthest-side ellipse at center, rgba(246,241,232,.85) 39%,rgba(212,204,186,.5) 100%)，底层使用背景图片。 任务二、控制背景图像尺寸 提示：使用backgroun 阅读全文
posted @ 2017-02-13 19:29 Lovebugs.cn 阅读(446) 评论(0) 推荐(0)
CSS3知识点整理（四）----布局样式及其他
摘要：包括CSS3多列布局样式、Flexbox伸缩布局、盒子模型等。重点介绍了Flexbox伸缩布局的各种属性用法。 一、多列布局 为了能在Web页面中方便实现类似报纸、杂志那种多列排版的布局，W3C特意给CSS3增加了一个多列布局模块（CSS Multi Column Layout Module）。它主 阅读全文
posted @ 2017-02-13 19:14 Lovebugs.cn 阅读(572) 评论(0) 推荐(1)
CSS3知识点整理（三）----变形与动画
摘要：形变tranform: rotate旋转/skew扭曲/scale缩放/translate移动/matrix矩阵变形;三种动画:tranform形变动画/transition缓动动画/animation逐帧动画; 阅读全文
posted @ 2017-02-13 15:01 Lovebugs.cn 阅读(456) 评论(0) 推荐(0)
CSS3知识点整理（二）----CSS3选择器
摘要：总结各种CSS3选择器的介绍及具体语法 还可学到 自定义复选框效果和图片阴影效果 众多选择器的意义就在于可以减少很多不必要的选择器定义，不必遇到标签就设置class或者ID，这样做会让浏览器更便于阅读，更容易让搜索引擎优化。 单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素。 阅读全文
posted @ 2017-02-10 20:47 Lovebugs.cn 阅读(615) 评论(1) 推荐(3)
CSS3特效----制作立体导航栏菜单
摘要：使用CSS3实现下图的导航菜单效果 阅读全文
posted @ 2017-02-10 13:52 Lovebugs.cn 阅读(651) 评论(0) 推荐(0)
CSS3知识点整理（一）----基本样式
摘要：（一） 在编写CSS3样式时，不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分，是浏览器的私有属性，虽然目前较新版本的浏览器都是不需要前缀的，但为了更好的向前兼容前缀还是少不了的。 (二) 边框 1）圆角效果border-radius border-radius:1 阅读全文
posted @ 2017-02-10 12:20 Lovebugs.cn 阅读(747) 评论(0) 推荐(1)