css3控制字体动态变换颜色 <!doctype html> <html> <head> <meta charset="utf-8"> <title>css3文字颜色更改</title> </head> <style> .site__title { color: #f35626; font-fami ...
分类:
Web程序 时间:
2019-11-21 10:02:39
阅读次数:
155
1.组合器 1.1后继组合器可以选择出给定元素在文档树中的子元素,一个元素中某元素类型的所有实例,例如 article p{...} 1.2.邻近同级组合器,它选择文档树中彼此相邻且有相同父元素的元素。以上面的例子为例,使用+操作符编写h2+p{...},就只给每个section中的起始段落设置样式 ...
分类:
Web程序 时间:
2019-11-20 16:44:41
阅读次数:
89
除了为文字添加阴影,我们还可以为盒模型添加阴影。盒模型阴影的属性名称为box-shadow,此属性与text-shadow一样有4个值,前两个值分别表示水平方向位移距离和垂直方向的位移距离,第三个值表示阴影的模糊半径(包含0及以下的值均表示无模糊),最后一个则是阴影的颜色。前Chrome 16+,F ...
分类:
Web程序 时间:
2019-11-18 09:37:52
阅读次数:
65
字体使用是网页设计中不可或缺的一部分。经常地,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计。美工设计师最常做的办法是把想要的文字做成图片,这样做有几个明显缺陷: Ø 不可能大范围的使用该字体; Ø 图片内容相对使用文字不易修 ...
分类:
Web程序 时间:
2019-11-18 09:14:48
阅读次数:
74
一、transform-origin 属性 设置旋转元素的基点位置,2D 转换元素能够改变元素 x 和 y 轴,3D 转换元素还能改变其 Z 轴。 必须与 transform 属性一同使用,不然不会有任何效果。 1、x-axis(以y轴为旋转中心时,元素(y轴)在x轴上的位置) 定义视图被置于 X ...
分类:
Web程序 时间:
2019-11-17 17:39:37
阅读次数:
92
作为一名前端开发人员,最头疼的莫过于浏览器兼容。远古时期万恶的IE6,到现在CSS3不兼容的IE7/8.为了保证不同版本浏览器都有共同或更优化的用户体验,前端搬砖的我们不得不与浏览器兼容顽强斗争。而渐进增强和优雅降级两种不同的开发流程,也是在我们项目初期做调研选型时会考虑的一个点。 渐进增强(Pro ...
分类:
其他好文 时间:
2019-11-17 13:14:00
阅读次数:
69
移动端的下拉刷新是一个很常见的功能,也有许多开源库实现了这个功能,不过为了学习,还是先自己写一个例子学习一下。其中用到了一些touch事件和一些DOM属性CSS3属性。直接上代码,代码里面有注释。 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
分类:
移动开发 时间:
2019-11-17 10:58:08
阅读次数:
84
点击开始 直接css动画 如果你要自己控制转到哪里 那就多写几个class 根据不同角度 运行不同的class。。<pre>.zhuandong{ animation: zhuandong 5s ease-in-out forwards; -webkit-animation: zhuandong 5 ...
分类:
Web程序 时间:
2019-11-17 10:55:16
阅读次数:
108
多列布局 基本概念 1、多列布局类似报纸或杂志中的排版方式,上要用以控制大篇幅文本。 2、跨列属性可以控制横跨列的数量 /*列数*/ -webkit-column-count: 3; /*分割线*/ -webkit-column-rule: dashed red; /*列间距*/ -webkit-c ...
分类:
其他好文 时间:
2019-11-16 21:42:30
阅读次数:
107
css3写下雨效果<pre><div class="xiayuxiaoguo"></div></pre> <pre>.xiayuxiaoguo{ width:100%; height: 100%; position: absolute; left:0px; top:0px; z-index: 2;} ...
分类:
Web程序 时间:
2019-11-16 14:47:39
阅读次数:
208