Monday, August 17, 2015

Hello! Today i am sharing you some of the cool css tricks and tips that will make your website look cool. Lets start from shadow property; Mot of you know that you can add shadow to text and images through shadow property in css. But you can do much more like making blood effect or fire effect. Here are some codes to make some effect.


Blood effect;



h1{
color:‪#‎f8f8ff‬;
text-align:center;
font-size:70px;
font-family:Comic Sans MS;
text-shadow:
4px 2px 1px #300000,
4px 4px 1px #400000,
4px 6px 1px #500000,
4px 6px 1px #600000,
4px 8px 1px #700000,
4px 10px 1px #800000,
4px 12px 1px #900000,
4px 14px 1px ‪#‎A00000‬,
4px 16px 1px ‪#‎B00000‬,
4px 18px 1px ‪#‎C00000‬,
4px 20px 1px ‪#‎D00000‬,
4px 22px 1px ‪#‎E00000‬,
4px 24px 1px ‪#‎F00000‬,
4px 26px 1px ‪#‎FA0000‬,
4px 28px 1px ‪#‎FB0000‬,
4px 30px 1px ‪#‎FC0000‬,
4px 32px 1px ‪#‎FD0000‬,
4px 34px 1px ‪#‎FE0000‬,
4px 36px 5px ‪#‎FF0000‬;
}


Fire effect;


h1{
margin-top:50px;
color:white;
font-family:Comic Sans MS;
text-shadow: 0 0 4px white,
0 -5px 4px ‪#‎FFFF33‬,
2px -10px 6px ‪#‎FFDD33‬,
-2px -15px 11px ‪#‎FF8800‬,
2px -25px 18px ‪#‎FF2200‬;
}

See my next post for more. smile emoticon

No comments:

Post a Comment