{"id":5487,"date":"2015-07-08T12:15:07","date_gmt":"2015-07-08T09:15:07","guid":{"rendered":"http:\/\/www.webcodegeeks.com\/?p=5487"},"modified":"2018-01-08T14:20:56","modified_gmt":"2018-01-08T12:20:56","slug":"css-background-opacity-example","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/","title":{"rendered":"CSS Background Opacity Example"},"content":{"rendered":"

The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid.<\/p>\n

The value applies to the element as a whole, including its contents, even though the value is not inherited by child elements inside a parent element. <\/p>\n

Thus, an element and its contained children all have the same opacity relative to the element’s background, even if the element and its children have different opacities relative to one another.<\/p>\n

The property is increasingly popular for web designers and takes basic design to a whole new level by enabling great visuals to your content.
\n 
\n[ulp id=’nAkUl5IbAjqlXSla’]<\/p>\n

1. Basic Setup and Application<\/h2>\n

Go ahead and create a new html document and add the basic sytnax in it like so:<\/p>\n

\r\n<!DOCTYPE html>\r\n<html>\r\n<head>\r\n\t<title>CSS Background Opacity Example<\/title>\r\n<\/head>\r\n<body>\r\n\r\n<!-- STYLE SECTION -->\r\n\r\n<style type=\"text\/css\">\r\n\r\n<\/style>\r\n\r\n<!-- HTML SECTION -->\r\n\r\n<\/body>\r\n<\/html>\r\n<\/pre>\n
Before applying the property, lets first give some key explanation. The syntax for opacity<\/code> and its main values would be:<\/p>\n
\r\n \/* Fully opaque *\/\r\nopacity: 1;\r\nopacity: 1.0;\r\n\r\n\/* Translucent *\/\r\nopacity: 0.6;\r\n\r\n\/* Fully transparent *\/\r\nopacity: 0.0;\r\nopacity: 0;\r\n\r\nopacity: inherit;\r\n<\/pre>\n
As you can see, values vary from 0 to 1, meaning 0% to 100%. To apply this property, first add an element in HTML:<\/p>\n
\r\n<!-- HTML SECTION  -->\r\n\r\n<h3 class=\"light\">This line will have a light background.<\/h3>\r\n<h3 class=\"half\">This line will have a half normal background.<\/h3>\r\n<h3 class=\"heavy\">This line will have a heavy background.<\/h3>\r\n<\/pre>\n
\r\n<!-- STYLE  SECTION -->\r\n\r\n<style type=\"text\/css\">\r\nh3 {\r\n\tbackground-color: green;\r\n\tcolor: white;\r\n}\r\n\r\n.light {\r\n\topacity: 0.2;\r\n}\r\n.half {\r\n\topacity: 0.5;\r\n}\r\n.heavy {\r\n\topacity: 0.8;\r\n}\r\n<\/style>\r\n<\/pre>\n
The view in the browser would be: like this:
\n
\"Basic<\/a>
Basic Background Opacity Application<\/figcaption><\/figure><\/p>\n
2. Cases and Examples<\/h2>\n
2.1 Different Opacity with Hover<\/h3>\n
Opacity may very well be a great hover effect for elements of HTML. Look at the button example below:<\/p>\n
\r\n\r\n\r\n
BUTTON HOVER<\/div>\r\n<\/pre>\n
\r\n.button {\r\n\tborder-radius: 0.4em;\r\n\tbackground-color: #d17474;\r\n\twidth: 10em;\r\n\tfont-weight: bold;\r\n\ttext-align: center;\r\n\tpadding: 1em;\r\n\tcolor: white;\r\n}\r\n.button:hover {\r\n\topacity: 0.7; \r\n}\r\n<\/pre>\n
Opacity now will be 30% less than the initial opacity on hover.
\n
\"Button<\/a>
Button Opacity on Hover<\/figcaption><\/figure><\/p>\n
2.2 Image Opacity Example<\/h3>\n
We can apply a nice opacity on images containing a transparent box inside. Look at the code below:<\/p>\n
\r\n<!-- HTML SECTION  -->\r\n\r\n<div class=\"image\"><div class=\"image-text\">BIRDS LIFE<\/div><\/div>\r\n<\/pre>\n
\r\n.image {\r\n\tbackground-image: url(image.jpg);\r\n\tbackground-repeat: no-repeat;\r\n\twidth: 600px;\r\n\theight: 400px;\r\n}\r\n\r\n.image-text {\r\n\twidth: 200px;\r\n\ttext-align: center;\r\n\tfont-size: 25px;\r\n\tfont-weight: bold;\r\n\tcolor: white;\r\n\tpadding: 1em;\r\n\tbackground: rgba(255,255,255,.5);  \/* set background color and opacity of text box *\/\r\n}\r\n<\/pre>\n
The image with a title styled with an opacity in the backround would look like this:<\/p>\n
\"Opacity<\/a>
Opacity Title of an Image<\/figcaption><\/figure>\n
Notice how we used the rgba<\/code> way to set color and opacity of the text box. Generally speaking, it is just the same as applying background color and opacity properties separately and giving same values, this is just to show you there is another way of how you can set these values in one single line. With RGBA, you set individual values for Red, Green and Blue colors.<\/p>\n
3. All Browser Compatibility<\/h2>\n
In order to make the opacity<\/code> property work on all browsers you just have to add the respective prefixes:<\/p>\n
-webkit-opacity: 0.5;<\/code>   –   for webkit-based browsers<\/p>\n
-moz-opacity: 0.5;<\/code>    –  for firefox based browsers<\/p>\n
filter: alpha(opacity=50)<\/code>    –  for IE8 and earlier versions<\/p>\n
opacity: 0.5;<\/code> – the general\/basic syntax of the property<\/p>\n
4. Conclusion<\/h2>\n
To conclude, we can say that the background opacity<\/code> property of CSS is a great tool to enhance your web page content  and makes it easier to have transparent elements or hovers in such simple and efficent way. Feel free to play around with  the property and see how you can get more productive and creative on your web projects.<\/p>\n
5. Download<\/h2>\n
\nYou can download the full source code of this example here: CSS Background Opacity<\/strong><\/a><\/div>\n","protected":false},"excerpt":{"rendered":"
The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value applies to the element as a whole, including its contents, even though the value is not inherited by child elements inside a parent element. Thus, an element and its contained …<\/p>\n","protected":false},"author":75,"featured_media":917,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[],"class_list":["post-5487","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-css"],"yoast_head":"\nCSS Background Opacity Example - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CSS Background Opacity Example - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Code Geeks\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webcodegeeks\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/fabiocimo\" \/>\n<meta property=\"article:published_time\" content=\"2015-07-08T09:15:07+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-01-08T12:20:56+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"150\" \/>\n\t<meta property=\"og:image:height\" content=\"150\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Fabio Cimo\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@fabiocimo\" \/>\n<meta name=\"twitter:site\" content=\"@webcodegeeks\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fabio Cimo\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\"},\"author\":{\"name\":\"Fabio Cimo\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22\"},\"headline\":\"CSS Background Opacity Example\",\"datePublished\":\"2015-07-08T09:15:07+00:00\",\"dateModified\":\"2018-01-08T12:20:56+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\"},\"wordCount\":477,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\",\"name\":\"CSS Background Opacity Example - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"datePublished\":\"2015-07-08T09:15:07+00:00\",\"dateModified\":\"2018-01-08T12:20:56+00:00\",\"description\":\"The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"CSS\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/css\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"CSS Background Opacity Example\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"name\":\"Web Code Geeks\",\"description\":\"Web Developers Resource Center\",\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.webcodegeeks.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\",\"name\":\"Exelixis Media P.C.\",\"url\":\"https:\/\/www.webcodegeeks.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png\",\"width\":864,\"height\":246,\"caption\":\"Exelixis Media P.C.\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webcodegeeks\",\"https:\/\/x.com\/webcodegeeks\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22\",\"name\":\"Fabio Cimo\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g\",\"caption\":\"Fabio Cimo\"},\"description\":\"Fabio is a passionate student in web tehnologies including front-end (HTML\/CSS) and web design. He likes exploring as much as possible about the world wide web and how it can be more productive for us all. Currently he studies Computer Engineering, at the same time he works as a freelancer on both web programming and graphic design.\",\"sameAs\":[\"https:\/\/www.facebook.com\/fabiocimo\",\"https:\/\/al.linkedin.com\/in\/fabiocimo\",\"https:\/\/x.com\/fabiocimo\",\"https:\/\/www.youtube.com\/fabiocimo1\"],\"url\":\"https:\/\/www.webcodegeeks.com\/author\/fabio-cimo\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"CSS Background Opacity Example - Web Code Geeks - 2026","description":"The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/","og_locale":"en_US","og_type":"article","og_title":"CSS Background Opacity Example - Web Code Geeks - 2026","og_description":"The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value","og_url":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/","og_site_name":"Web Code Geeks","article_publisher":"https:\/\/www.facebook.com\/webcodegeeks","article_author":"https:\/\/www.facebook.com\/fabiocimo","article_published_time":"2015-07-08T09:15:07+00:00","article_modified_time":"2018-01-08T12:20:56+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","type":"image\/jpeg"}],"author":"Fabio Cimo","twitter_card":"summary_large_image","twitter_creator":"@fabiocimo","twitter_site":"@webcodegeeks","twitter_misc":{"Written by":"Fabio Cimo","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/"},"author":{"name":"Fabio Cimo","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22"},"headline":"CSS Background Opacity Example","datePublished":"2015-07-08T09:15:07+00:00","dateModified":"2018-01-08T12:20:56+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/"},"wordCount":477,"commentCount":0,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/","url":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/","name":"CSS Background Opacity Example - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","datePublished":"2015-07-08T09:15:07+00:00","dateModified":"2018-01-08T12:20:56+00:00","description":"The opacity CSS property specifies the transparency of an element, that is, the degree to which the background behind the element is overlaid. The value","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/css3-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/css\/css-background-opacity-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"CSS","item":"https:\/\/www.webcodegeeks.com\/category\/css\/"},{"@type":"ListItem","position":3,"name":"CSS Background Opacity Example"}]},{"@type":"WebSite","@id":"https:\/\/www.webcodegeeks.com\/#website","url":"https:\/\/www.webcodegeeks.com\/","name":"Web Code Geeks","description":"Web Developers Resource Center","publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.webcodegeeks.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.webcodegeeks.com\/#organization","name":"Exelixis Media P.C.","url":"https:\/\/www.webcodegeeks.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2022\/06\/exelixis-logo.png","width":864,"height":246,"caption":"Exelixis Media P.C."},"image":{"@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webcodegeeks","https:\/\/x.com\/webcodegeeks"]},{"@type":"Person","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22","name":"Fabio Cimo","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b3df055f2e1b62e238889fafbb16121c68aab1adcd11af670e185cafae201b3b?s=96&d=mm&r=g","caption":"Fabio Cimo"},"description":"Fabio is a passionate student in web tehnologies including front-end (HTML\/CSS) and web design. He likes exploring as much as possible about the world wide web and how it can be more productive for us all. Currently he studies Computer Engineering, at the same time he works as a freelancer on both web programming and graphic design.","sameAs":["https:\/\/www.facebook.com\/fabiocimo","https:\/\/al.linkedin.com\/in\/fabiocimo","https:\/\/x.com\/fabiocimo","https:\/\/www.youtube.com\/fabiocimo1"],"url":"https:\/\/www.webcodegeeks.com\/author\/fabio-cimo\/"}]}},"_links":{"self":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/5487","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/users\/75"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/comments?post=5487"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/5487\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/917"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=5487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=5487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=5487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}