 |
位置：电子教程 > 微信小程序设计教程 (如果看不到内容请使用360浏览器) | 推荐学习资源 |
|
位置：电子教程 > 微信小程序设计教程 (如果看不到内容请使用360浏览器) | 推荐学习资源 |
| 当前阅读教程：微信小程序设计教程 > 文本阴影（text-shadow） | |||||||||||
| 阅读(22555525) 收藏 赞(5685) 分享 | |||||||||||
| 上一篇： 文本溢出（text-overflow） | 下一篇： 字符转换（text-transform） | ||||||||||
1.基础语法在 CSS3 中，text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表，每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。参数如下：
2.小程序应用根据基础的语法，下面在微信小程序中实现文本的不同阴影效果。 .wxml文件代码示例如下： <view> 文字阴影模糊效果 </view> <view> 白色的文本文字阴影 </view> <view> 霓虹灯的光芒文字阴影 </view> .wxss文件代码示例如下： /*文字阴影模糊效果*/
.cls1{
text-shadow: 2px 2px 8px #FF0000;
}
/*白色的文本文字阴影*/
.cls2{
color:white;
text-shadow:2px 2px 4px #000000;
}
/*霓虹灯的光芒文字阴影*/
.cls3{
text-shadow:0 0 3px #FF0000;
}效果如图3-11所示。
|
|||||||||||
| 上一篇： 文本溢出（text-overflow） | 下一篇： 字符转换（text-transform） | ||||||||||
