{"id":1031,"date":"2013-06-28T12:39:16","date_gmt":"2013-06-28T12:39:16","guid":{"rendered":"https:\/\/ibex.tech\/cloud\/?p=1031"},"modified":"2022-07-19T08:47:19","modified_gmt":"2022-07-19T07:47:19","slug":"background-images-2","status":"publish","type":"post","link":"https:\/\/ibex.tech\/cloud\/css\/background\/background-images-2","title":{"rendered":"Background Images"},"content":{"rendered":"\n<h4 class=\"wp-block-heading\">Background image and color fill<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>  background-color: #7f7f7f;\n  background-image: url('..\/mytheme\/images\/myimage.png');\n  background-repeat: no-repeat;\n  background-size: 50px 50px;\n  background-position: 4px 4px;<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Displaying An Image At A specific Postiion In The Background<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>#header .pad {\n  background: url('\/images\/my-logo-header.png') no-repeat;\n  background-size: 50px 100px;\n  background-position: 0px 10px; \n  height: 120px;\t\t\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Displaying An Image Offset From Right Edge<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>.LinksWithArow a {\r\n  background: url('images\/button-link-arrow.png') no-repeat;\r\n  background-size: 16px 16px;\r\n  background-position: center right;\r\n  padding-right:18px;\r\n  min-height: 16px;\r\n}\n\n#header .pad {\n  background: url('\/images\/my-logo-header.png') no-repeat;\n  background-size: 50px 100px;\n  background-position: top 0px right 10px; \n  height: 120px;\t\t\n}<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Multiple Background Images<\/h4>\n\n\n\n<p>See <a href=\"\/cloud\/css\/background\/multiple-background-images\">here<\/a>.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Use image to fill both width and height<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>\n\tbackground-image: url(images\/background.jpg);\n\tbackground-repeat: no-repeat;\n\tbackground-size: cover;\n<\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\">Use image to fit width or height<\/h4>\n\n\n\n<pre class=\"wp-block-code\"><code>\n\tbackground-image: url(images\/background.jpg);\n\tbackground-repeat: no-repeat;\n\tbackground-size: contain;<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"<p>Background image and color fill Displaying An Image At A specific Postiion In The Background Displaying An Image Offset From Right Edge Multiple Background Images See here. Use image to fill both width and height Use image to fit width or height<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[200],"tags":[],"class_list":["post-1031","post","type-post","status-publish","format-standard","hentry","category-background"],"_links":{"self":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/1031","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/comments?post=1031"}],"version-history":[{"count":8,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/1031\/revisions"}],"predecessor-version":[{"id":4373,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/posts\/1031\/revisions\/4373"}],"wp:attachment":[{"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/media?parent=1031"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/categories?post=1031"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ibex.tech\/cloud\/wp-json\/wp\/v2\/tags?post=1031"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}