MrMurphy1: Textumriss mit transparentem Text?

Beitrag lesen

Hallo,

transparenz bei Schriften kenne ich auch nur bei Outline-Schriftarten, siehe z. B.

<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8"><!-- Schließende Slashes sind unter HTML5 nicht erforderlich, aber erlaubt -->
   <title>Outline Schriften</title>
   <meta name="description" content="HTML5, CSS3">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- Um alte IE HTML5-tauglich zu machen -->
   <!--[if lt IE 9]>
      <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
   <![endif]-->
   <!-- Internes CSS ("type="text/css" ist unter HTML5 nicht erforderlich) -->
   <style>
   /* Googe-Fonts */
   /* font-family: 'Open Sans', sans-serif; */
   /* font-family: 'Roboto Slab', serif; */
   /* font-family: 'Merriweather Sans', sans-serif; */
   /* font-family: 'Rye', cursive; */
   /* font-family: 'Ribeye Marrow', cursive; */
   /* font-family: 'Ewert', cursive; */
   /* font-family: 'Jacques Francois Shadow', cursive; */
   @import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700|Roboto+Slab:400,700|Merriweather+Sans|Niconne|Rye|Ribeye+Marrow|Ewert|Jacques+Francois+Shadow);
      /* Neue HTML5-Elemente für ältere Browser als Block-Elemente übergeben */
      header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
         display: block;
      }
      * {
         -moz-box-sizing: border-box;
         box-sizing: border-box;
      }
      html {
         font-size: 120%;
      }
      body {
         padding: 0;
         background-color: orange;
      }
      p {
         font-size: 5rem;
         letter-spacing: 0.5rem;
         font-weight: bold;
      }
      p:nth-child(1) {
         font-family: 'Rye', cursive;
      }
      p:nth-child(2) {
         font-family: 'Ribeye Marrow', cursive;
      }
      p:nth-child(3) {
         font-family: 'Ewert', cursive;
      }
      p:nth-child(4) {
         font-family: 'Jacques Francois Shadow', cursive;
      }
   </style>
</head>
<body>
   <p>Testtext</p>
   <p>Testtext</p>
   <p>Testtext</p>
   <p>Testtext</p>
</body>
</html>

Gruss

MrMurphy