Created
September 20, 2012 22:50
-
-
Save crismanNoble/3758820 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="knockout"><a href="http://mksht.crisnoble.com" rel="Like cool shit? visit my site">mksht</a></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Today we will make knockout style text, in just CSS | |
//Warning: It will only work in webkit browswers (like chrome or safari) | |
//All of the credit for this technique goes to the unremebered person who I somehow got the code from here: http://jsfiddle.net/m3mkx/1/ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.knockout { | |
background: url(http://apod.nasa.gov/apod/image/0603/coma_misti.jpg) -80px -80px; | |
color: red; | |
-webkit-text-fill-color: transparent; | |
-webkit-background-clip: text; | |
font-weight: bold; | |
font-size: 100px; | |
font-family: arial, helvetica; | |
width: 600px; | |
margin: 50px auto; | |
text-align: center; | |
} | |
body{ | |
background: #444; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment