JSFiddle - React, Tailwind, and code Playground
by adward
HTML
<script src="http://www.hintzmann.dk/testcenter/js/jquery/textshadow/jquery.textshadow.js"></script>
<div id="phone_numbers_block">
<div>Корпоративный блог</div>
<h4 class="descript">Описание</h4>
<span class="slogan_small">Все виды загрузки</span>
</div>
CSS
body {
margin:30px;
background: url(http://leadertrans.su/wp-content/themes/moris/img/bg.jpg) #c2c2c2;
}
.slogan_small {
font-family: Calibri;
font-weight: normal;
font-style: italic;
font-size: 30px;
color: #1B9719;
text-shadow:
-1px -1px #666,
1px 1px white,
20px 10px 30px white,
-20px 10px 30px white,
20px -10px 30px white,
-20px -10px 30px white;
text-align: left;
}
#phone_numbers_block div, #phone_numbers_block2 div, .caption, #content_block_center_center_caption, .right_side_center_caption
{
font-style: italic;
font-family:calibri;
font-size:29px;
font-weight: normal;
letter-spacing: -1px;
color: #1a8118;
text-shadow:
-1px -1px #666,
1px 1px white,
20px 10px 30px white,
-20px 10px 30px white,
20px -10px 30px white,
-20px -10px 30px white;
}
.descript{
font-style: italic;
font-family:calibri;
font-size:29px;
font-weight: normal;
/*background-color: #666666;*/
-webkit-background-clip: text;
-moz-background-clip: text;
/*background-clip: text;*/
/*color: transparent;*/
text-shadow: rgba(255,255,255,0.5) 0px 3px 3px;
}
JavaScript
$(document).ready(function(){
// $("#phone_numbers_block div").textShadow({x:-1, y:-1, radius: 0, color: "#666"});
$("#phone_numbers_block div").textShadow({x:1, y:1, radius: 0, color: "white"});
// $("#phone_numbers_block div").textShadow({x:10, y:10, radius: 10, color: "white"});
// $("#phone_numbers_block div").textShadow({x:-10, y:10, radius: 10, color: "white"});
// $("#phone_numbers_block div").textShadow({x:10, y:-10, radius: 10, color: "white"});
// $("#phone_numbers_block div").textShadow({x:-10, y:-10, radius: 10, color: "white"});
})