{"id":1125,"date":"2024-11-18T18:43:27","date_gmt":"2024-11-18T12:58:27","guid":{"rendered":"https:\/\/code-projects.org\/?p=1125"},"modified":"2024-11-18T18:43:27","modified_gmt":"2024-11-18T12:58:27","slug":"art-photo-gallery-using-html-css","status":"publish","type":"post","link":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/","title":{"rendered":"Art And Photo Gallery using HTML , CSS &#038; JavaScript"},"content":{"rendered":"<h2>PROJECT:\u00a0Multi-Color gallery using HTML and CSS with JS and Bootstrap<\/h2>\n<p>This an online profile gallery to store or upload photos. This simple yet responsive site is designed in HTML and CSS validated with JS. To make it more reactive bootstrap is used to make it\u00a0more responsive.<\/p>\n<p>It will help the students to get more knowledge and idea to make such responsive. This project is made for the user for the better experience in the photo gallery. For the project demo, you can have a look at the video below:<\/p>\n<p><iframe loading=\"lazy\" title=\"ART AND PHOTO GALLERY USING HTML , CSS &amp; JAVASCRIPT\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/TQvCwO6El9E?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe><\/p>\n<h3>To Download Multicolor art gallery click here&#8230;<\/h3>\n\n<p>[cpdownload=b900a7cb-3943-4bcd-b5a7-5eba17e465d5]<\/p>\n","protected":false},"excerpt":{"rendered":"<p>PROJECT:\u00a0Multi-Color gallery using HTML and CSS with JS and Bootstrap This an online profile gallery to store or upload photos. [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":1132,"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-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":"","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-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":"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":""},"mobile":{"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":""}},"footnotes":""},"categories":[440,210,3],"tags":[],"post_format":[],"class_list":["post-1125","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html-projects","category-jsprojects","category-project"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Art And Photo Gallery using HTML , CSS &amp; JavaScript - Source Code &amp; Projects<\/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:\/\/code-projects.org\/art-photo-gallery-using-html-css\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Art And Photo Gallery using HTML , CSS &amp; JavaScript - Source Code &amp; Projects\" \/>\n<meta property=\"og:description\" content=\"PROJECT:\u00a0Multi-Color gallery using HTML and CSS with JS and Bootstrap This an online profile gallery to store or upload photos. [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/\" \/>\n<meta property=\"og:site_name\" content=\"Source Code &amp; Projects\" \/>\n<meta property=\"article:published_time\" content=\"2024-11-18T12:58:27+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/f3-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1330\" \/>\n\t<meta property=\"og:image:height\" content=\"473\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Carmelo Garcia\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carmelo Garcia\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/\"},\"author\":{\"name\":\"Carmelo Garcia\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/66a568e97b9ba7844033e1f44c8bf820\"},\"headline\":\"Art And Photo Gallery using HTML , CSS &#038; JavaScript\",\"datePublished\":\"2024-11-18T12:58:27+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/\"},\"wordCount\":123,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/ad6c464da800d8658830febb9d1e5d53\"},\"image\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/f3-1.jpg\",\"articleSection\":[\"HTML Projects\",\"JavaScript Projects\",\"Project\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/\",\"url\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/\",\"name\":\"Art And Photo Gallery using HTML , CSS & JavaScript - Source Code &amp; Projects\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/f3-1.jpg\",\"datePublished\":\"2024-11-18T12:58:27+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#primaryimage\",\"url\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/f3-1.jpg\",\"contentUrl\":\"https:\\\/\\\/code-projects.org\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/f3-1.jpg\",\"width\":1330,\"height\":473},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/art-photo-gallery-using-html-css\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/code-projects.org\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Art And Photo Gallery using HTML , CSS &#038; JavaScript\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/#website\",\"url\":\"https:\\\/\\\/code-projects.org\\\/\",\"name\":\"Source Code &amp; Projects\",\"description\":\"Projects, Tutorials, and more\",\"publisher\":{\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/ad6c464da800d8658830febb9d1e5d53\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/code-projects.org\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/ad6c464da800d8658830febb9d1e5d53\",\"name\":\"mysterioushoul\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\",\"caption\":\"mysterioushoul\"},\"logo\":{\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/code-projects.org\\\/#\\\/schema\\\/person\\\/66a568e97b9ba7844033e1f44c8bf820\",\"name\":\"Carmelo Garcia\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g\",\"caption\":\"Carmelo Garcia\"},\"url\":\"https:\\\/\\\/code-projects.org\\\/author\\\/carmelo\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Art And Photo Gallery using HTML , CSS & JavaScript - Source Code &amp; Projects","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:\/\/code-projects.org\/art-photo-gallery-using-html-css\/","og_locale":"en_US","og_type":"article","og_title":"Art And Photo Gallery using HTML , CSS & JavaScript - Source Code &amp; Projects","og_description":"PROJECT:\u00a0Multi-Color gallery using HTML and CSS with JS and Bootstrap This an online profile gallery to store or upload photos. [&hellip;]","og_url":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/","og_site_name":"Source Code &amp; Projects","article_published_time":"2024-11-18T12:58:27+00:00","og_image":[{"width":1330,"height":473,"url":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/f3-1.jpg","type":"image\/jpeg"}],"author":"Carmelo Garcia","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Carmelo Garcia","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#article","isPartOf":{"@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/"},"author":{"name":"Carmelo Garcia","@id":"https:\/\/code-projects.org\/#\/schema\/person\/66a568e97b9ba7844033e1f44c8bf820"},"headline":"Art And Photo Gallery using HTML , CSS &#038; JavaScript","datePublished":"2024-11-18T12:58:27+00:00","mainEntityOfPage":{"@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/"},"wordCount":123,"commentCount":0,"publisher":{"@id":"https:\/\/code-projects.org\/#\/schema\/person\/ad6c464da800d8658830febb9d1e5d53"},"image":{"@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#primaryimage"},"thumbnailUrl":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/f3-1.jpg","articleSection":["HTML Projects","JavaScript Projects","Project"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/","url":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/","name":"Art And Photo Gallery using HTML , CSS & JavaScript - Source Code &amp; Projects","isPartOf":{"@id":"https:\/\/code-projects.org\/#website"},"primaryImageOfPage":{"@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#primaryimage"},"image":{"@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#primaryimage"},"thumbnailUrl":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/f3-1.jpg","datePublished":"2024-11-18T12:58:27+00:00","breadcrumb":{"@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#primaryimage","url":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/f3-1.jpg","contentUrl":"https:\/\/code-projects.org\/wp-content\/uploads\/2017\/11\/f3-1.jpg","width":1330,"height":473},{"@type":"BreadcrumbList","@id":"https:\/\/code-projects.org\/art-photo-gallery-using-html-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/code-projects.org\/"},{"@type":"ListItem","position":2,"name":"Art And Photo Gallery using HTML , CSS &#038; JavaScript"}]},{"@type":"WebSite","@id":"https:\/\/code-projects.org\/#website","url":"https:\/\/code-projects.org\/","name":"Source Code &amp; Projects","description":"Projects, Tutorials, and more","publisher":{"@id":"https:\/\/code-projects.org\/#\/schema\/person\/ad6c464da800d8658830febb9d1e5d53"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/code-projects.org\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/code-projects.org\/#\/schema\/person\/ad6c464da800d8658830febb9d1e5d53","name":"mysterioushoul","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g","caption":"mysterioushoul"},"logo":{"@id":"https:\/\/secure.gravatar.com\/avatar\/d98500cd3daff9ff16ff72f70ab6605a78dd404da144f3886ee3746243cdf6d3?s=96&d=monsterid&r=g"}},{"@type":"Person","@id":"https:\/\/code-projects.org\/#\/schema\/person\/66a568e97b9ba7844033e1f44c8bf820","name":"Carmelo Garcia","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/a4e665031eea0a2fd90872fd2c3845a826bd0a72abd1fb4894437d8f0caaf9e5?s=96&d=monsterid&r=g","caption":"Carmelo Garcia"},"url":"https:\/\/code-projects.org\/author\/carmelo\/"}]}},"_links":{"self":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts\/1125","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/comments?post=1125"}],"version-history":[{"count":8,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts\/1125\/revisions"}],"predecessor-version":[{"id":30373,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/posts\/1125\/revisions\/30373"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/media\/1132"}],"wp:attachment":[{"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/media?parent=1125"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/categories?post=1125"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/tags?post=1125"},{"taxonomy":"post_format","embeddable":true,"href":"https:\/\/code-projects.org\/wp-json\/wp\/v2\/post_format?post=1125"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}