Skip to content

Instantly share code, notes, and snippets.

@tavriaforever
Forked from tyv/dabblet.css
Created May 15, 2012 13:21
Show Gist options
  • Save tavriaforever/2701714 to your computer and use it in GitHub Desktop.
Save tavriaforever/2701714 to your computer and use it in GitHub Desktop.
Сделать объемную надпись
/*
Сделать объемную надпись
http://clck.ru/d/wF6GyFCC14CDp
*/
.hollywood
{
padding: 50px 0 0 20px;
margin: 0;
min-height: 1000px;
font: bold 100px/1.2 Arial;
text-transform: uppercase;
background-color: #006e00;
color: #fbc100;
text-shadow: 2px 1px #cc8e00,
3px 2px #ba7a00,
4px 3px #b07000,
5px 4px #a56400,
6px 5px #9a5800,
7px 6px #904c00,
7px 6px #854000,
8px 7px #4f4f00;
}
.hollywood span:hover
{
color: #fbc91a;
cursor: pointer;
text-shadow: 3px 2px #cc8e00,
4px 3px #ba7a00,
5px 4px #b07000,
6px 5px #a56400,
7px 6px #9a5800,
8px 7px #904c00,
9px 8px #854000,
10px 9px #4f4f00;
}
.hollywood span
{
position: relative;
letter-spacing: 10px;
}
.hollywood span:nth-child(2)
{
top: 5px;
}
.hollywood span:nth-child(3)
{
top: 13px;
}
.hollywood span:nth-child(4)
{
top: 2px;
}
.hollywood span:nth-child(5),
.hollywood span:nth-child(6)
{
top: -3px;
}
.hollywood span:nth-child(7)
{
top: -10px;
}
<p class="hollywood">
<span>h</span><span>o</span><span>l</span><span>l</span><span>y</span><span>w</span><span>o</span><span>o</span><span>d</span>
</p>
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment