zoukankan      html  css  js  c++  java
  • 如何设置文字的阴影

    如何设置文字的阴影?

    转载自https://www.cnblogs.com/Renyi-Fan/p/9262595.html

      一、总结(点击显示或隐藏总结内容)

    一句话总结:text-shadow属性。text-shadow:3px 3px 3px #f0f;

     

    1、text-shadow属性的参数依次是什么意思?

    水平及垂直偏移

    模糊距离(这个参数相当于ps里面的羽化半径)

    颜色

     

     

    2、所有阴影类的属性必备的三个属性是什么(带上颜色是四个)?

    水平及垂直偏移

    模糊距离(这个参数相当于ps里面的羽化半径)

     

     

     

    二、如何设置文字的阴影

    1、相关知识

    文本样式:
    1.text-shadow
    text-shadow:3px 3px 3px #f0f;

    语法

    text-shadow: h-shadow v-shadow blur color;

    注释:text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表,每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。

    描述测试
    h-shadow 必需。水平阴影的位置。允许负值。 测试
    v-shadow 必需。垂直阴影的位置。允许负值。 测试
    blur 可选。模糊的距离。 测试
    color 可选。阴影的颜色。参阅 CSS 颜色值 测试

    2、代码

    文字的阴影

    复制代码
     1 <!doctype html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>index</title>
     6     <style>
     7         *{
     8             font-family: 微软雅黑;
     9         }
    10         
    11         p{
    12             text-shadow:3px 3px 3px #00f;
    13         }    
    14     </style>
    15 </head>
    16 <body>
    17     <div>
    18         <p>linux is very much!</p>
    19         <p>linux is very much!</p>
    20         <p>linux is very much!</p>
    21         <p>linux is very much!</p>
    22         <p>linux is very much!</p>
    23     </div>
    24 </body>
    25 </html>
    复制代码
     
  • 相关阅读:
    centos networkmanager 和 network配置冲突
    Struts ajax json重新整理
    Struts2 ajax json小例子
    (转)json-lib 的maven dependency
    Struts2文件下载
    jQuery自定义滚动条插件mCustomScrollbar
    Struts2自定义拦截器
    Spring的自动装配在session监听器失效
    mysql 分组+排序+限定
    mysql触发器
  • 原文地址:https://www.cnblogs.com/yanyanstyle/p/11478394.html
Copyright © 2011-2022 走看看