最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
利用CSS创造多彩文字
时间：2022-07-02 13:04:49 编辑：袖梨 来源：一聚教程网
效果：
文字的上半部分
文字的下半部分
二组文字重合的效果
原理：
将二个相同而色彩不同的文字重合在一起，通过分别给其加 clip 属性，使上面和下面的文字被剪切位置不同，从而产生二种不同的色彩。
clip : 摘自苏沈小雨CSS手册
clip : auto | rect ( number number number number )
参数：
auto : 对象无剪切
rect ( number number number number ) :
依据上-右-下-左的顺序提供自对象左上角为(0,0)坐标计算的四个偏移数值，其中任一数值都可用auto替换，即此边不剪切
说明：
检索或设置对象的可视区域。区域外的部分是透明的。
必须将position的值设为absolute，此属性方可使用。
测试环境：
Firefox1.5、IE6.0、Opera8.5、IE5.01绿色版通过。
| 代码如下 | 复制代码 |
| CSS .textBottom { color: #333333; position: absolute; left: 3em; top: 1em; font: 26px Century Gothic,Arial, Helvetica, sans-serif; clip: rect(18px auto auto auto); } .textTop { color: #CC0000; position: absolute; left: 3em; top: 1em; font: 26px Century Gothic,Arial, Helvetica, sans-serif; clip: rect(0 auto 18px 0); } .container { width: 28em; height: 5em; margin: 1em auto; position: relative; background: #F6F6F6; } xhtml |
|
相关文章
- 王者荣耀侦探能力大测试攻略 王者荣耀侦探能力大测试怎么过 11-22
- 无期迷途主线前瞻兑换码是什么 11-22
- 原神欧洛伦怎么培养 11-22
- 炉石传说网易云音乐联动怎么玩 11-22
- 永劫无间手游确幸转盘怎么样 11-22
- 无期迷途主线前瞻兑换码是什么 无期迷途主线前瞻直播兑换码介绍 11-22