• 技术文章 >web前端 >css教程

    css怎么设置文字描边效果

    VV2020-11-20 17:26:04原创1374

    css设置文字描边效果的方法:可以利用text-stroke-color属性来进行设置,如【-webkit-text-stroke-color:#ff0;】。属性text-stroke-color用来设置或检索对象中的文字的描边颜色。

    相关属性:

    text-stroke-color:<color> 属性设置或检索对象中的文字的描边颜色

    (学习视频分享:css视频教程

    属性值:

    <color>:指定文字的描边颜色。

    兼容性:

    82f017d91b1c2c667e018ef4efb6373.png

    举例:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title>text-stroke-color</title>
    <style>
    html,body{font:bold 14px/1.5 georgia,simsun,sans-serif;text-align:center;}
    .stroke h1{margin:0;padding:10px 0 0;}
    .stroke p{
    margin:50px auto 100px;font-size:100px;
    -webkit-text-stroke-width:2px;
    -webkit-text-stroke-color:#ff0;
    }
    .copyright,.info{font-style:italic;}
    </style>
    </head>
    <body>
    <body>
    <div>
    <h1>描边的文字:</h1>
    <p>我是被描了2像素黄边的文字</p>
    </div>
    </body>
    </html>

    相关推荐:CSS教程

    以上就是css怎么设置文字描边效果的详细内容,更多请关注php中文网其它相关文章!

    本文原创发布php中文网,转载请注明出处,感谢您的尊重!
    专题推荐:css 文字 描边效果
    上一篇:css中内联元素可继承的属性有哪些? 下一篇:分享一些提高前端开发效率的CSS 属性选择器!!
    第14期线上培训班

    相关文章推荐

    • css实现文字描边以及倒影效果• css怎么实现字体描边效果• css给文字添加描边的方法是什么• css描边属性是什么

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网