{"id":1289,"date":"2013-09-14T04:49:45","date_gmt":"2013-09-14T04:49:45","guid":{"rendered":"http:\/\/www.phpmind.com\/blog\/?p=1289"},"modified":"2017-06-16T03:47:46","modified_gmt":"2017-06-16T03:47:46","slug":"how-to-use-text-shadow-property-in-css3","status":"publish","type":"post","link":"https:\/\/www.phpmind.com\/blog\/2013\/09\/how-to-use-text-shadow-property-in-css3\/","title":{"rendered":"How to use CSS3 text shadow property ?"},"content":{"rendered":"<ul>\n<li>CSS3 introduces two new text properties-\n<ol>\n<li>text-shadow<\/li>\n<li>word-wrap<\/li>\n<\/ol>\n<\/li>\n<li><span class=\"phpmind_text_heading_green\">text-shadow: <\/span>This property gives designers and css coders a tool to give multiple text effects. Earlier which could only be done by giving effects to an image. There are various advantages of this property.Browser support: text shadow property is supported by all modern browsers except IE9.\n<pre lang=\"php\">     p{\r\n     \tfont-family:Verdana, Geneva, sans-serif;\r\n\t\tfont-size:24px;\r\n\t\tfont-weight:bold;\r\n\t\tcolor:#006600;\r\n\t\ttext-align:justify;\r\n\t\ttext-shadow: 4px 4px 7px #009900;\r\n  \t   }<\/pre>\n<div class=\"phpmind_text_shadow_eg\">WELCOME<br \/>\nTO<br \/>\nWWW.PHPMIND.COM<\/div>\n<\/li>\n<li><span class=\"phpmind_text_heading_green\">word-wrap: <\/span>This property helps us to split the words in the middle if it is too long and cross the borders of the parent element.Browser support: word-wrap property is supported by all modern browsers\n<pre lang=\"php\">     div{\r\n     \t background:#EFEFEF;\r\n         border: 1px solid #999999;\r\n         color: #333333;\r\n         padding: 10px;\r\n         width: 200px;\r\n         word-wrap: break-word;\r\n  \t }<\/pre>\n<p>&nbsp;<\/p>\n<p class=\"phpmind_word_wrap\">This word is very longgggggggggggggggggggggggggggggggggggggggggggggggggg to fit in a div. We can break it by using word-wrap property.<\/p>\n<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>CSS3 introduces two new text properties- text-shadow word-wrap text-shadow: This property gives designers and css coders a tool to give multiple text effects. Earlier which could only be done by giving effects to an image. There are various advantages of this property.Browser support: text shadow property is supported by all modern browsers except IE9. p{ [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"categories":[46],"tags":[],"class_list":["post-1289","post","type-post","status-publish","format-standard","hentry","category-css3"],"_links":{"self":[{"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/posts\/1289","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/comments?post=1289"}],"version-history":[{"count":9,"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/posts\/1289\/revisions"}],"predecessor-version":[{"id":1303,"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/posts\/1289\/revisions\/1303"}],"wp:attachment":[{"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/media?parent=1289"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/categories?post=1289"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.phpmind.com\/blog\/wp-json\/wp\/v2\/tags?post=1289"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}