蓝色背景中的白色插入文本答案

【问题标题】：White inset text in blue background蓝色背景中的白色插入文本
【发布时间】：2013-08-10 23:46:29
【问题描述】：

我看到很多插入文字，但没有一个是白色的。我想要蓝色背景的白色插入文本。是怎么做到的？

这是我目前所拥有的，但似乎无法插入文本（另见下面的小提琴）。

HTML：

<body>
  <div>
    <h1><a href=#>H</a>
    E
    L
    L
    O
    </h1>
  </div>
</body>

CSS：

    body {
        font-family: 'Sigmar One', cursive;
        font-size: 100px;
        color: white;
        text-shadow: 4px 4px 4px #000;

        background-color:#0047B2;

        width: 100%;
        height: 100%;
        margin: 0;
    }


    div {
        position:absolute; 
        height:100%; 
        width:100%;
        display: table;
    }

    h1 {
        display: table-cell;
        vertical-align: middle;
        text-align:center;
    }

    a:visited, a:hover, a:active {
        text-decoration: none;
        color: white;
    }

    a:link {
        text-decoration: none;

        text-shadow: 0px 2px 3px rgba(255,255,255,.25);
        -webkit-background-clip: text;
           -moz-background-clip: text;
                background-clip: text;
    }

    a:hover {
        text-shadow: 4px 4px 4px #000;
        color: white;
    }

http://jsfiddle.net/8Huu7/1/

【问题讨论】：

标签： html css insets

【解决方案1】：

我会使用绘图程序将背景设为蓝色，然后在背景中添加白色文本并保存图像，然后将该图像用作网页的背景。

应该没那么难。

例如body background="background1.png"

【讨论】：