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



我看到了很多插入文本,但没有一个是白色的。我想要蓝色背景的白色插入文本。它是如何完成的?

这就是我到目前为止所拥有的,但似乎无法插入文本(也请参阅下面的fiddle)。

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/

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

不应该那么难。

例如,body background="background1.png"

最新更新