{"id":7762,"date":"2015-10-21T16:15:21","date_gmt":"2015-10-21T13:15:21","guid":{"rendered":"http:\/\/www.webcodegeeks.com\/?p=7762"},"modified":"2017-12-21T15:52:12","modified_gmt":"2017-12-21T13:52:12","slug":"jquery-css-addremove-style-example","status":"publish","type":"post","link":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/","title":{"rendered":"jQuery CSS add\/remove Style Example"},"content":{"rendered":"

The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS library, jQuery. <\/p>\n

Now jQuery offers reliable ways to select elements and apply methods, which basically means that what we want to do, shall be found inside a method, and it is true. <\/p>\n

For most of the article, we’ll make use of .css()<\/code> method, which is our key to all CSS properties that can be applied with just a slightly different syntax inside the brackets. Follow along with simple and then more complex application of CSS manipulations.
\n 
\n[ulp id=’qGGDqWnle19VavkM’]<\/p>\n

1. Document Setup<\/h2>\n

To begin, create a new HTML document and add the following basic syntax inside like so:<\/p>\n

\r\n<!DOCTYPE html>\r\n<html>\r\n<head>\r\n\t<title>jQuery CSS Example<\/title>\r\n<\/head>\r\n<body>\r\n\r\n<!-- HTML SECTION  -->\r\n\r\n\r\n<!-- JAVASCRIPT SECTION  -->\r\n<script src=\"jquery-1.11.3.min.js\"><\/script>\r\n\r\n<script type=\"text\/javascript\">\r\n\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n<\/pre>\n
Note that the jQuery library is linked locally. If you don’t have the downloaded file, you can find it here<\/a>.<\/p>\n
2. Know the Basics<\/h2>\n
In this section we’ll consider the most basic syntax and application of the .css()<\/code>, which is of essential improtance.<\/p>\n
2.1 Syntax<\/h3>\n
The basic syntax of the method is: <\/p>\n
1. .css( propertyName )<\/code> where the propertyName<\/strong> is of type String<\/strong> and contains a single CSS property.<\/p>\n
2. .css( propertyNames )<\/code> where the propertyNames<\/strong> is an array<\/strong> of one or more CSS properties.<\/p>\n
The method will get the value of a computed style property for the first element in the set of matched elements or set one or more CSS properties for every matched element.<\/p>\n
2.2 A Basic Application<\/h3>\n
Let us apply the method on a simple case. First, add a text element on HTML, say, for example, a h3<\/code>:<\/p>\n
\r\n<!-- HTML SECTION  -->\r\n<h3>I am a basic example<\/h3>\r\n<\/pre>\n
In the JS section, let’s change the color of the text to blue:<\/p>\n
\r\n<!-- JAVASCRIPT SECTION  -->\r\n<script type=\"text\/javascript\">\r\n    $('h3').css({color: '#2980b9'});\r\n<\/script>\r\n<\/pre>\n
The result would be pretty straight:
\n\"css1\"<\/a><\/p>\n
Additionally, we can as many properties as we like to that element separated by a comma, for example:<\/p>\n
\r\n<!-- JAVASCRIPT SECTION  -->\r\n<script type=\"text\/javascript\">\r\n$('h3').css({\r\n    color: '#fff',\r\n    background: '#1abc9c',\r\n    padding: '1em',\r\n    width: '20%'\r\n});\r\n<\/script>\r\n<\/pre>\n
The result in this case is:
\n\"css2\"<\/a><\/p>\n
Simple as that, follow this rule when trying to change styles with jQuery: $('jQuery selector').css({\"css property name\":\"css property value\"});<\/code><\/p>\n
3. Styling Cases<\/h2>\n
3.1 Changing Style on Events<\/h3>\n
Just like you can change styling as soon as the HTML is ready, you can also choose to do this on specific event listeners. Let’s modify the example above to apply styling on mouseover<\/code>:<\/p>\n
\r\n<!-- JAVASCRIPT SECTION  -->\r\n<script type=\"text\/javascript\">\r\n$('h3').mouseover(function() {\r\n    $(this).css({\r\n    color: '#fff',\r\n    background: '#1abc9c',\r\n    padding: '1em',\r\n    width: '20%'\r\n    });\r\n});\r\n<\/script>\r\n<\/pre>\n
\"css3\"<\/a><\/p>\n
3.2 Extend Existing Styles Values<\/h3>\n
You may wish to just extend a style based upon it\u2019s current value. For example, if an element\u2019s padding-left was 10px then the following code would result in a total padding-left of 25px.<\/p>\n
\r\n<!-- JAVASCRIPT SECTION  -->\r\n<script type=\"text\/javascript\">\r\n$('selector').css( \"padding-left\", \"+=15\" );\r\n<\/script>\r\n<\/pre>\n
3.3 .css()<\/strong> Function Property<\/h3>\n
As most of you may already know, as of jQuery 1.4, .css() allows us to pass a function as the property value. This is handy for returning current CSS values to determine changes.<\/p>\n
\r\n<!-- JAVASCRIPT SECTION  -->\r\n<script type=\"text\/javascript\">\r\n$('div.example').css('width', function(index) {\r\n  return index * 50;\r\n});\r\n<\/script>\r\n<\/pre>\n
3.4 Alternative Approach to .css()<\/strong> Method<\/h3>\n
Well, up until now, we’ve only been focused to the .css() method. However, there is also another useful way to change styles dynamically, and this includes the .addClass<\/code> and removeClass<\/code> methods of jQuery. To see how this works, first create two non-existing classes in CSS like so:<\/p>\n
\r\n.basic {\r\n    font-size: 1.2em;\r\n    font-weight: 300;\r\n    color: #c0392b;\r\n    border: 0.1em solid #ccc;\r\n    width: 25%;\r\n}\r\n.stylish {\r\n    font-size: 1.5em;\r\n    font-weight: 500;\r\n    color: #fff;\r\n    padding: 1.5em;\r\n    background: #8e44ad;\r\n    width: 25%;\r\n}\r\n<\/pre>\n
Now in the HTML section, add a new div<\/code> element with some text inside:<\/p>\n
\r\n<div>An Alternative Set of Methods<\/div>\r\n<\/pre>\n
The idea is to add a class and then remove it or do it in the same time.<\/p>\n
CASE 1<\/strong> – Adding a Class<\/p>\n
\r\n$('div').addClass('basic');\r\n<\/pre>\n
\"css4\"<\/a><\/p>\n
CASE 2<\/strong> – Removing a Class and Adding Another<\/p>\n
\r\n$('div').removeClass('basic').addClass('stylish');\r\n<\/pre>\n
\"css5\"<\/a><\/p>\n
4. Conclusion<\/h2>\n
The .css() method is a convenient way to get a computed style property from the first matched element, especially in light of the different ways browsers access most of those properties (the getComputedStyle()<\/code> method in standards-based browsers versus the currentStyle and runtimeStyle properties in Internet Explorer) and the different terms browsers use for certain properties. The trend of changing styles dynamically is taking over the web more and more and this knowledge is a must for web developers and designers.<\/p>\n
5. Download<\/h2>\n
Download<\/strong>
\nYou can download the full source code of this example here: jQuery CSS<\/strong><\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS library, jQuery. Now jQuery offers reliable ways to select elements and apply methods, which basically means that what we want to do, shall be found inside …<\/p>\n","protected":false},"author":75,"featured_media":919,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23],"tags":[236],"class_list":["post-7762","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-jquery","tag-css"],"yoast_head":"\njQuery CSS add\/remove Style Example - Web Code Geeks - 2026<\/title>\n<meta name=\"description\" content=\"The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS\" \/>\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\/javascript\/jquery\/jquery-css-addremove-style-example\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"jQuery CSS add\/remove Style Example - Web Code Geeks - 2026\" \/>\n<meta property=\"og:description\" content=\"The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-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-10-21T13:15:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-12-21T13:52:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-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\/javascript\/jquery\/jquery-css-addremove-style-example\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/\"},\"author\":{\"name\":\"Fabio Cimo\",\"@id\":\"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22\"},\"headline\":\"jQuery CSS add\/remove Style Example\",\"datePublished\":\"2015-10-21T13:15:21+00:00\",\"dateModified\":\"2017-12-21T13:52:12+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/\"},\"wordCount\":626,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg\",\"keywords\":[\"CSS\"],\"articleSection\":[\"jQuery\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/\",\"url\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/\",\"name\":\"jQuery CSS add\/remove Style Example - Web Code Geeks - 2026\",\"isPartOf\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg\",\"datePublished\":\"2015-10-21T13:15:21+00:00\",\"dateModified\":\"2017-12-21T13:52:12+00:00\",\"description\":\"The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS\",\"breadcrumb\":{\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage\",\"url\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg\",\"contentUrl\":\"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg\",\"width\":150,\"height\":150},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.webcodegeeks.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JavaScript\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"jQuery\",\"item\":\"https:\/\/www.webcodegeeks.com\/category\/javascript\/jquery\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"jQuery CSS add\/remove Style 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":"jQuery CSS add\/remove Style Example - Web Code Geeks - 2026","description":"The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS","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\/javascript\/jquery\/jquery-css-addremove-style-example\/","og_locale":"en_US","og_type":"article","og_title":"jQuery CSS add\/remove Style Example - Web Code Geeks - 2026","og_description":"The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS","og_url":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-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-10-21T13:15:21+00:00","article_modified_time":"2017-12-21T13:52:12+00:00","og_image":[{"width":150,"height":150,"url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-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\/javascript\/jquery\/jquery-css-addremove-style-example\/#article","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/"},"author":{"name":"Fabio Cimo","@id":"https:\/\/www.webcodegeeks.com\/#\/schema\/person\/1dfb88b4a8d08c37a6080311fd330a22"},"headline":"jQuery CSS add\/remove Style Example","datePublished":"2015-10-21T13:15:21+00:00","dateModified":"2017-12-21T13:52:12+00:00","mainEntityOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/"},"wordCount":626,"commentCount":0,"publisher":{"@id":"https:\/\/www.webcodegeeks.com\/#organization"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg","keywords":["CSS"],"articleSection":["jQuery"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/","url":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/","name":"jQuery CSS add\/remove Style Example - Web Code Geeks - 2026","isPartOf":{"@id":"https:\/\/www.webcodegeeks.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage"},"image":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage"},"thumbnailUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg","datePublished":"2015-10-21T13:15:21+00:00","dateModified":"2017-12-21T13:52:12+00:00","description":"The aim of this example is to show how you can manipulate CSS, add or remove styling from elements in a dynamic manner, made possible by the famous JS","breadcrumb":{"@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#primaryimage","url":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg","contentUrl":"https:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2014\/10\/jquery-logo.jpg","width":150,"height":150},{"@type":"BreadcrumbList","@id":"https:\/\/www.webcodegeeks.com\/javascript\/jquery\/jquery-css-addremove-style-example\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.webcodegeeks.com\/"},{"@type":"ListItem","position":2,"name":"JavaScript","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/"},{"@type":"ListItem","position":3,"name":"jQuery","item":"https:\/\/www.webcodegeeks.com\/category\/javascript\/jquery\/"},{"@type":"ListItem","position":4,"name":"jQuery CSS add\/remove Style 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\/7762","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=7762"}],"version-history":[{"count":0,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/posts\/7762\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media\/919"}],"wp:attachment":[{"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/media?parent=7762"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/categories?post=7762"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webcodegeeks.com\/wp-json\/wp\/v2\/tags?post=7762"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}