{"id":73,"date":"2024-07-15T09:27:18","date_gmt":"2024-07-15T09:27:18","guid":{"rendered":"https:\/\/shaplakanon.com\/wdc\/?p=73"},"modified":"2024-07-15T09:27:19","modified_gmt":"2024-07-15T09:27:19","slug":"tutorial-understanding-css-colors-and-backgrounds","status":"publish","type":"post","link":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/","title":{"rendered":"Tutorial: Understanding CSS Colors and Backgrounds"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\">Introduction<\/h3>\n\n\n\n<p>In web design, colors and backgrounds play a crucial role in the overall aesthetics and user experience of a website. CSS (Cascading Style Sheets) provides powerful tools to manage colors and backgrounds, allowing developers to create visually appealing and engaging web pages. This tutorial will guide you through the basics of CSS colors and backgrounds, covering key concepts, properties, and practical examples.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">CSS Colors<\/h3>\n\n\n\n<p>Colors in CSS can be specified using different methods, including color names, HEX values, RGB, RGBA, HSL, and HSLA. Let&#8217;s explore each method:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">1. Color Names<\/h4>\n\n\n\n<p>CSS supports 140 standard color names, such as <code>red<\/code>, <code>blue<\/code>, <code>green<\/code>, <code>yellow<\/code>, etc.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: red;\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">2. HEX Values<\/h4>\n\n\n\n<p>A HEX value is a six-digit code preceded by a <code>#<\/code>, representing the intensity of red, green, and blue in a color.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: #ff0000; \/* Red *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">3. RGB Values<\/h4>\n\n\n\n<p>The RGB (Red, Green, Blue) model defines colors in terms of the intensity of these three primary colors.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: rgb(255, 0, 0); \/* Red *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">4. RGBA Values<\/h4>\n\n\n\n<p>RGBA is an extension of RGB with an alpha channel, which specifies the opacity of the color. The alpha value ranges from 0 (fully transparent) to 1 (fully opaque).<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: rgba(255, 0, 0, 0.5); \/* Semi-transparent Red *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">5. HSL Values<\/h4>\n\n\n\n<p>HSL (Hue, Saturation, Lightness) defines colors using three components: hue (color type), saturation (intensity), and lightness (brightness).<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: hsl(0, 100%, 50%); \/* Red *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">6. HSLA Values<\/h4>\n\n\n\n<p>HSLA is an extension of HSL with an alpha channel for opacity.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>p {\n  color: hsla(0, 100%, 50%, 0.5); \/* Semi-transparent Red *\/\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">CSS Backgrounds<\/h3>\n\n\n\n<p>CSS provides several properties to style the background of an element, including <code>background-color<\/code>, <code>background-image<\/code>, <code>background-repeat<\/code>, <code>background-attachment<\/code>, and <code>background-position<\/code>. Let&#8217;s explore these properties:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">1. Background Color<\/h4>\n\n\n\n<p>The <code>background-color<\/code> property sets the background color of an element.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background-color: lightblue;\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">2. Background Image<\/h4>\n\n\n\n<p>The <code>background-image<\/code> property sets an image as the background of an element.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background-image: url('background.jpg');\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">3. Background Repeat<\/h4>\n\n\n\n<p>The <code>background-repeat<\/code> property controls whether and how the background image repeats.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background-image: url('background.jpg');\n  background-repeat: repeat; \/* The default value *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-repeat: no-repeat; \/* No repetition *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-repeat: repeat-x; \/* Repeats horizontally *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-repeat: repeat-y; \/* Repeats vertically *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">4. Background Attachment<\/h4>\n\n\n\n<p>The <code>background-attachment<\/code> property specifies whether the background image is fixed or scrolls with the page.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background-image: url('background.jpg');\n  background-attachment: scroll; \/* The default value *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-attachment: fixed; \/* Fixed background *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-attachment: local; \/* Scrolls with the element's content *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">5. Background Position<\/h4>\n\n\n\n<p>The <code>background-position<\/code> property sets the initial position of the background image.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background-image: url('background.jpg');\n  background-position: left top; \/* The default value *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-position: center; \/* Centered background *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-position: right bottom; \/* Positioned at the bottom-right *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">6. Background Size<\/h4>\n\n\n\n<p>The <code>background-size<\/code> property specifies the size of the background image.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background-image: url('background.jpg');\n  background-size: auto; \/* The default value *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-size: cover; \/* Scales the image to cover the entire element *\/\n}\n\ndiv {\n  background-image: url('background.jpg');\n  background-size: contain; \/* Scales the image to fit within the element *\/\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">7. Background Shorthand Property<\/h4>\n\n\n\n<p>The <code>background<\/code> shorthand property allows you to set multiple background properties in a single declaration.<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>div {\n  background: lightblue url('background.jpg') no-repeat center center \/ cover;\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Practical Examples<\/h3>\n\n\n\n<p>Let&#8217;s apply what we&#8217;ve learned in some practical examples:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Example 1: Setting a Solid Background Color<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n&lt;head&gt;\n  &lt;meta charset=\"UTF-8\"&gt;\n  &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n  &lt;style&gt;\n    body {\n      background-color: lightgray;\n    }\n    h1 {\n      color: navy;\n    }\n  &lt;\/style&gt;\n  &lt;title&gt;Solid Background Color&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n  &lt;h1&gt;Welcome to My Website&lt;\/h1&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Example 2: Adding a Background Image<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;!DOCTYPE html&gt;\n&lt;html lang=\"en\"&gt;\n&lt;head&gt;\n  &lt;meta charset=\"UTF-8\"&gt;\n  &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n  &lt;style&gt;\n    body {\n      background-image: url('background.jpg');\n      background-size: cover;\n      background-attachment: fixed;\n    }\n    h1 {\n      color: white;\n    }\n  &lt;\/style&gt;\n  &lt;title&gt;Background Image&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n  &lt;h1&gt;Welcome to My Website&lt;\/h1&gt;\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Conclusion<\/h3>\n\n\n\n<p>Understanding CSS colors and backgrounds is essential for creating visually appealing web designs. By mastering these properties and applying them creatively, you can enhance the user experience and make your websites more engaging. Practice using different color and background properties to see the effects they have on your designs.<\/p>\n\n\n\n<p>Feel free to experiment and combine different properties to achieve the desired look and feel for your web pages. Happy coding!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introduction In web design, colors and backgrounds play a crucial role in the overall aesthetics and user experience of a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[16],"tags":[],"class_list":["post-73","post","type-post","status-publish","format-standard","hentry","category-css"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Tutorial: Understanding CSS Colors and Backgrounds - Web Development Course<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tutorial: Understanding CSS Colors and Backgrounds - Web Development Course\" \/>\n<meta property=\"og:description\" content=\"Introduction In web design, colors and backgrounds play a crucial role in the overall aesthetics and user experience of a [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Development Course\" \/>\n<meta property=\"article:published_time\" content=\"2024-07-15T09:27:18+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-07-15T09:27:19+00:00\" \/>\n<meta name=\"author\" content=\"ShaplaKanon\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"ShaplaKanon\" \/>\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:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/\"},\"author\":{\"name\":\"ShaplaKanon\",\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/#\\\/schema\\\/person\\\/f5f224239283c27426dadc2e4cc9a825\"},\"headline\":\"Tutorial: Understanding CSS Colors and Backgrounds\",\"datePublished\":\"2024-07-15T09:27:18+00:00\",\"dateModified\":\"2024-07-15T09:27:19+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/\"},\"wordCount\":417,\"commentCount\":0,\"articleSection\":[\"CSS\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/\",\"url\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/\",\"name\":\"Tutorial: Understanding CSS Colors and Backgrounds - Web Development Course\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/#website\"},\"datePublished\":\"2024-07-15T09:27:18+00:00\",\"dateModified\":\"2024-07-15T09:27:19+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/#\\\/schema\\\/person\\\/f5f224239283c27426dadc2e4cc9a825\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/tutorial-understanding-css-colors-and-backgrounds\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Tutorial: Understanding CSS Colors and Backgrounds\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/#website\",\"url\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/\",\"name\":\"Web Development Course\",\"description\":\"Become a Web Developer from Home\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/#\\\/schema\\\/person\\\/f5f224239283c27426dadc2e4cc9a825\",\"name\":\"ShaplaKanon\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ef2c8f93a0558c2047555f674c8746b22988ace93eba9262d198d0a28236ce97?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ef2c8f93a0558c2047555f674c8746b22988ace93eba9262d198d0a28236ce97?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ef2c8f93a0558c2047555f674c8746b22988ace93eba9262d198d0a28236ce97?s=96&d=mm&r=g\",\"caption\":\"ShaplaKanon\"},\"sameAs\":[\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/\"],\"url\":\"https:\\\/\\\/shaplakanon.com\\\/wdc\\\/author\\\/sabahat\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Tutorial: Understanding CSS Colors and Backgrounds - Web Development Course","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:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/","og_locale":"en_US","og_type":"article","og_title":"Tutorial: Understanding CSS Colors and Backgrounds - Web Development Course","og_description":"Introduction In web design, colors and backgrounds play a crucial role in the overall aesthetics and user experience of a [&hellip;]","og_url":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/","og_site_name":"Web Development Course","article_published_time":"2024-07-15T09:27:18+00:00","article_modified_time":"2024-07-15T09:27:19+00:00","author":"ShaplaKanon","twitter_card":"summary_large_image","twitter_misc":{"Written by":"ShaplaKanon","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/#article","isPartOf":{"@id":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/"},"author":{"name":"ShaplaKanon","@id":"https:\/\/shaplakanon.com\/wdc\/#\/schema\/person\/f5f224239283c27426dadc2e4cc9a825"},"headline":"Tutorial: Understanding CSS Colors and Backgrounds","datePublished":"2024-07-15T09:27:18+00:00","dateModified":"2024-07-15T09:27:19+00:00","mainEntityOfPage":{"@id":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/"},"wordCount":417,"commentCount":0,"articleSection":["CSS"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/","url":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/","name":"Tutorial: Understanding CSS Colors and Backgrounds - Web Development Course","isPartOf":{"@id":"https:\/\/shaplakanon.com\/wdc\/#website"},"datePublished":"2024-07-15T09:27:18+00:00","dateModified":"2024-07-15T09:27:19+00:00","author":{"@id":"https:\/\/shaplakanon.com\/wdc\/#\/schema\/person\/f5f224239283c27426dadc2e4cc9a825"},"breadcrumb":{"@id":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/shaplakanon.com\/wdc\/tutorial-understanding-css-colors-and-backgrounds\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/shaplakanon.com\/wdc\/"},{"@type":"ListItem","position":2,"name":"Tutorial: Understanding CSS Colors and Backgrounds"}]},{"@type":"WebSite","@id":"https:\/\/shaplakanon.com\/wdc\/#website","url":"https:\/\/shaplakanon.com\/wdc\/","name":"Web Development Course","description":"Become a Web Developer from Home","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/shaplakanon.com\/wdc\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/shaplakanon.com\/wdc\/#\/schema\/person\/f5f224239283c27426dadc2e4cc9a825","name":"ShaplaKanon","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/ef2c8f93a0558c2047555f674c8746b22988ace93eba9262d198d0a28236ce97?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/ef2c8f93a0558c2047555f674c8746b22988ace93eba9262d198d0a28236ce97?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/ef2c8f93a0558c2047555f674c8746b22988ace93eba9262d198d0a28236ce97?s=96&d=mm&r=g","caption":"ShaplaKanon"},"sameAs":["https:\/\/shaplakanon.com\/wdc\/"],"url":"https:\/\/shaplakanon.com\/wdc\/author\/sabahat\/"}]}},"_links":{"self":[{"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/posts\/73","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/comments?post=73"}],"version-history":[{"count":1,"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/posts\/73\/revisions"}],"predecessor-version":[{"id":74,"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/posts\/73\/revisions\/74"}],"wp:attachment":[{"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/media?parent=73"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/categories?post=73"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/shaplakanon.com\/wdc\/wp-json\/wp\/v2\/tags?post=73"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}