The Walking Dead (webkit)

Developer
Patrick Cox
Size
2,685 Kb
Views
22,264
  1. The Walking Dead (webkit) Previews
  2. The Walking Dead (webkit) HTML Codes
  3. The Walking Dead (webkit) CSS Codes
  4. The Walking Dead (webkit) JS Codes

How do I make an the walking dead (webkit)?

In honor of it's return last week. Inspired by Trent Walton's CSS Mask-Image & Text - http://trentwalton.com/2011/05/19/mask-image-text/. What is a the walking dead (webkit)? How do you make a the walking dead (webkit)? This script and codes were developed by Patrick Cox on 30 August 2022, Tuesday.

The Walking Dead (webkit) Previews
IQ Test

The Walking Dead (webkit) - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>The Walking Dead (webkit)</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ body{ font-family: impact, sans-serif; font-size: 62.5%; padding-top: 8%; text-transform: uppercase; background: url(http://patrick-cox.com/bg-twd.png) no-repeat center center fixed; background-size: cover;
}
.logo{ width: 600px; margin: 0 auto; position: relative;
}
p, h2{ color: #fff6d9; z-index: 50; text-shadow: 0 4px 26px #000;
}
p:before{ content: "THE"; position: absolute; color: #8b6b44; z-index: 0; mask-image: url(http://patrick-cox.com/texture.png);
}
p{ font-size: 1.6rem; padding-left: 90px;
}
p:after{ content: "the"; position: absolute; color: #d5bf98; z-index: 100; mask-image: url(http://patrick-cox.com/texture-2.png); left: 90px;
}
h2:before{ content: "WALKING DEAD"; position: absolute; color: #8b6b44; z-index: 0; mask-image: url(http://patrick-cox.com/texture.png);
}
h2{ font-size: 6.4rem;
}
h2:after{ content: "WALKING DEAD"; position: absolute; color: #d5bf98; z-index: 100; mask-image: url(http://patrick-cox.com/texture-2.png); left: 1px;
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <div class="logo"> <p>the</p> <h2>walking dead</h2>
</div> <script src="js/index.js"></script>
</body>
</html>

The Walking Dead (webkit) - Script Codes CSS Codes

body{ font-family: impact, sans-serif; font-size: 62.5%; padding-top: 8%; text-transform: uppercase; background: url(http://patrick-cox.com/bg-twd.png) no-repeat center center fixed; background-size: cover;
}
.logo{ width: 600px; margin: 0 auto; position: relative;
}
p, h2{ color: #fff6d9; z-index: 50; text-shadow: 0 4px 26px #000;
}
p:before{ content: "THE"; position: absolute; color: #8b6b44; z-index: 0; mask-image: url(http://patrick-cox.com/texture.png);
}
p{ font-size: 1.6rem; padding-left: 90px;
}
p:after{ content: "the"; position: absolute; color: #d5bf98; z-index: 100; mask-image: url(http://patrick-cox.com/texture-2.png); left: 90px;
}
h2:before{ content: "WALKING DEAD"; position: absolute; color: #8b6b44; z-index: 0; mask-image: url(http://patrick-cox.com/texture.png);
}
h2{ font-size: 6.4rem;
}
h2:after{ content: "WALKING DEAD"; position: absolute; color: #d5bf98; z-index: 100; mask-image: url(http://patrick-cox.com/texture-2.png); left: 1px;
}

The Walking Dead (webkit) - Script Codes JS Codes

/*
inspired by Trent Walton's CSS Mask-Image & Text - http://trentwalton.com/2011/05/19/mask-image-text/
not the real font, I'm using Impact instead of Tungsten - http://www.typography.com/fonts/font_features.php?featureID=105&productLineID=100035
*/
The Walking Dead (webkit) - Script Codes
The Walking Dead (webkit) - Script Codes
Home Page Home
Developer Patrick Cox
Username pcridesagain
Uploaded August 30, 2022
Rating 4
Size 2,685 Kb
Views 22,264
Do you need developer help for The Walking Dead (webkit)?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Patrick Cox (pcridesagain) Script Codes
Name
Vans Logo, single element, no fonts, no psuedos
Single Element Pure CSS US Flag
Sexy Version - iOS web app bookmark reminder bubble
A Pen by Patrick Cox
Responsive Content Experiment
CSS Q-Bert
A Better Moustache
IOS web app bookmark reminder bubble
A Pen by Patrick Cox
Create amazing art & images with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!