给需要实现文字描边的元素添加如下CSS3的属性

text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;

-webkit-text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;

-moz-text-shadow:#000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;

*filter: Glow(color=#000, strength=1);

实现前效果:

实现后效果:

语法详解:

text-shadow:向文本设置阴影。

text-shadow:color||length||length||opacity。

color:指定颜色。

length:第一个length指定阴影在水平方向上的延伸距离,第二个length指定阴影在垂直方向上的延伸距离,可以为负值。

opacity:指定阴影模糊效果的作用距离。

用逗号分隔的4个属性值代表的方向顺序为右下左上。

为了兼容多浏览器而加上前缀-webkit-和-moz-。

filter:滤镜。

filter:Glow 添加光辉晕圈效果在元素对象的边外。

filter:Glow(color=颜色值,strength=数值)。

color:指定晕圈发光效果的颜色。

strength:指定晕圈发光的强度范围,参数值从1到255。

 
来源: 谢斌个人博客, CSS3文字描边 CSS3字体外部描边。 
转载请以链接形式标明本文地址!本文地址:http://www.xb02.com/article/8/

CSS3文字描边 CSS3字体外部描边的更多相关文章

  1. 3.css3文字与字体

    1.css3文字与字体: ①Font-size:大小. ⑴通常使用px.百分比.em来设置大小: ⑵xx-small.x-small.small.medium.large.x-large.xx-lar ...

  2. CSS3文字阴影实现乳白文字效果

    CSS3文字阴影实现乳白文字效果是一款有效利用css3的text-shadow属性,可以实现很多漂亮的效果,CSS3 文字阴影 文字特效,字体效果. 源码下载:http://www.huiyi8.co ...

  3. CSS3制作404立体字体

    CSS3制作404立体字体页面效果     鼠标移动上去,背景色变白.       动态效果:     .demo p:first-child span:hover { text-shadow:0px ...

  4. css3-2 CSS3选择器和文本字体样式

    css3-2   CSS3选择器和文本字体样式 一.总结 一句话总结:是要记下来的,记下来可以省很多事. 1.css的基本选择器中的:first-letter和:first-line是什么意思? :f ...

  5. Css3 文字渐变整理(一)

    一.文本颜色渐变 <gradient> :可以应用在所有接受图像的属性上,允许使用简单的语法实现颜色渐变,以便UA在渲染页面自动生成图像. 语法:<gradient> = li ...

  6. jQuery+CSS3文字跑马灯特效

    jQuery+CSS3文字跑马灯特效是一款将跑马灯背景制作为3D立方体效果,文字在上面移动时,就像是文字投影到墙壁上,在转角出会改变运动方向. 效果展示 http://hovertree.com/te ...

  7. css3 文字的设置

    1.text-shadow 有3个length参数,第1个表示水平偏移,第2个表示垂直偏移,第3个表示模糊(可选) .text11{text-shadow: 3px 3px 5px #f00 ;col ...

  8. 纯CSS3文字Loading动画特效

    纯CSS3文字Loading动画特效是一款个性的loading文字加载动画. 在线演示本地下载

  9. CSS3 文字渐变动画

    背景剪裁 语法:background-clip: border-box || padding-box || context-box || no-clip || text 本次用到的就是: -webki ...

随机推荐

  1. Redis简介及3.0.2编译安装

    由于项目需要Redis作为内存数据库,所以也开始搞Redis~ Redis是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).l ...

  2. CF 161D Distance in Tree 树形DP

    一棵树,边长都是1,问这棵树有多少点对的距离刚好为k 令tree(i)表示以i为根的子树 dp[i][j][1]:在tree(i)中,经过节点i,长度为j,其中一个端点为i的路径的个数dp[i][j] ...

  3. oracle里要查看一条sql的执行情况,有没有走到索引,怎么看?索引不能提高效率?

    index scan 索引扫描 full table scan是全表扫描 直接explain plan for 还有个set autotrace什么 索引一定能提高执行效率吗? 索引不能提高效率的情况 ...

  4. windows下脚本检测tomcat是否启动,没有启动则启动

    最近有个服务需要部署到windows server2003上面,机房没有windows ser的机器,没办法搞了个阿里云服务,购买的配置比较低, 不知道什么原因,tomcat启动后总是容易自动退出,搞 ...

  5. java 编译中没有清除之前编译出来的文件。

    最近在写一个类时候使用了内部类,然后又将这个类改用普通类来实现.但在运行时访问局部变量时候出现了NullPointException异常,想来想去没有想明白,后来清除了一个之前编译出来的文件*.cla ...

  6. 【JavaScript】创建命名空间,Class,LOG

    JxUnderscore(function (J, _, root) { var isWindow, deepObject, Namespace, Class, LOG; /** * 一个对象是否为w ...

  7. ubuntu更换源后报错:W: GPG error: (转载)

    From:http://www.njava.com/njava-626.html 更换163源后,更新源时出现错误. # apt-get update W: GPG error: http://ext ...

  8. Linux磁盘系统基础知识(转载)

    From:http://www.liusuping.com/ubuntu-linux/linux-disk-basic.html 在Linux系统下对于IDE硬盘,每块盘有一个设备名:对应于主板的四个 ...

  9. Python进阶01 词典

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 基础教程介绍了基本概念,特别是对象和类. 进阶教程对基础教程的进一步拓展,说明Py ...

  10. Jmeter监控系统等资源,ServerAgent端口的修改

    默认情况下在下载的ServerAgent下,如果服务是windows系统,则直接启动"startAgent.bat"即可,如果是Linux系统,则直接启动"./start ...