基本结构

text-shadow: 30px 23px 31px #;/* 文字阴影： 水平位移 垂直位移  模糊程度  阴影颜色*/

凹凸文字

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        body {

            background-color: #666;

        }

        p {

            text-align: center;

            color: #666;

            margin: 100px auto;

            font-size: 120px;

        }

        p:nth-child(1) {

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

        }

        p:nth-child(2) {

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

        }

    </style>

</head>

<body>

<p>天苍苍野茫茫</p>

<p>风吹草低见牛羊</p>

</body>

</html>

html5——文本阴影的更多相关文章

  1. 文本溢出text-overflow和文本阴影text-shadow

    前面的话 CSS3新增了一些关于文本的样式,其中text-overflow文本溢出和text-shadow文本阴影有些特别.因为它们有对应的overflow溢出属性和box-shadow盒子阴影属性. ...

  2. Popline：帅气的浮动 HTML5 文本编辑器工具栏

    Popline 是一个基于 HTML5 实现的富文本编辑器工具栏,设计灵感来自 PopClip ,相比传统的文本编辑器工具,Popline 能够浮动在编辑的文本周围,操作起来十分方便. 您可能感兴趣的 ...

  3. CSS3 一、文本阴影text-shadow属性

    文本阴影text-shadow属性特效: 1.右下角阴影,左下角阴影,左上角阴影,右上角阴影 <!DOCTYPE html> <html lang="en"> ...

  4. html5文本框提示文字属性为placeholder

    html5文本框提示文字属性为placeholder 例子:  <textarea id="comment" class="commentCont"  n ...

  5. 文本阴影text-shadow

    文本阴影text-shadow text-shadow可以用来设置文本的阴影效果. 语法: text-shadow: X-Offset Y-Offset blur color; X-Offset:表示 ...

  6. HTML5 Canvas阴影用法演示

    HTML5 Canvas阴影用法演示 HTML5 Canvas中提供了设置阴影的四个属性值分别为: context.shadowColor = “red” 表示设置阴影颜色为红色 context.sh ...

  7. CSS3 --添加阴影（盒子阴影、文本阴影的使用）

     CSS3 - 给div或者文字添加阴影(盒子阴影.文本阴影的使用)CSS3定义了两种阴影:盒子阴影和文本阴影.其中盒子阴影需要IE9及其更新版本,而文本阴影需要IE10及其更新版本.下面分别介绍两种 ...

  8. CSS3文本阴影、边框阴影

    CSS3添加阴影 一.使用text-shadow属性为文本添加阴影 二.使用box-shadow属性为边框添加阴影 一.为文本添加阴影 text-shadow     使用text-shadow,可以 ...

  9. CSS中使用文本阴影与元素阴影

    文本阴影介绍 在CSS中使用text-shadow属性设置文本阴影,该属性一共有4个属性值如:水平阴影.垂直阴影.(清晰度或模糊距离).阴影颜色. text-shadow属性值说明,在文本阴影实践中: ...

随机推荐

  1. vue.js 利用组件之间通讯，写一个弹出框例子

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. code wars quiz: toInteger

    Your task is to program a function which converts any input to an integer. Do not perform rounding, ...

  3. android中listview点击事件的监听实现

    listview_bookmark.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public vo ...

  4. [bzoj 1042][HAOI2008]硬币购物（用容斥原理弄背包）

    题目:http://www.lydsy.com:808/JudgeOnline/problem.php?id=1042 分析: 解法很巧妙,用f[i]表示四种硬币A.B.C.D的数量不考虑的情况下弄成 ...

  5. PHP array_keys()

    定义和用法 array_keys() 函数返回包含数组中所有键名的一个新数组. 如果提供了第二个参数,则只返回键值为该值的键名. 如果 strict 参数指定为 true,则 PHP 会使用全等比较 ...

  6. redis 主从备份自动切换+java代码实现类

    转载:http://blog.csdn.net/qq_23430789/article/details/52185706 目录(?)[-] redis-0sentinel实例之间的通讯端口 maste ...

  7. 转：SQL 索引最左前缀原理

    表结构和索引列 假设数据库中表是这样的:  我们只考虑一张表employees.titles: 索引是(emp_no,title,from_date) SHOW INDEX FROM employee ...

  8. 1.5 - 动态路由协议ISIS

    IS-IS 特征: 1:协议操作起来,比OSPF要简单 2:扩展性比OSPF要好,易于扩展 3:对IPv6有很好的支持 4:能够同时支持IP网络,和CLNS网络(OSI网络)(集成的IS-IS) 5: ...

  9. android 通过子线程跳转activity并传递内容

    android 子线程中不能够更新ui已经根深蒂固在我的脑海里,当时也就理所当然的觉得子线程中也是不能够进行界面的跳转的,可是在后来的学习中,发现居然是能够通过子线程来进行activity的跳转时,立 ...

  10. Unity学习笔记(4) --- Unity的界面排版:初识GUI

    GUI和GUILayout是Unity提供的UIKit.在使用GUI的Controls时都要求设置Rect參数.没办法做到自己主动排版,给适配带来难度.而GUILayout的设计就是为了弥补这个缺陷, ...