{"id":9118,"date":"2024-01-19T17:59:00","date_gmt":"2024-01-19T17:59:00","guid":{"rendered":"https:\/\/codehim.com\/?p=9118"},"modified":"2024-01-22T15:59:34","modified_gmt":"2024-01-22T10:59:34","slug":"simple-landing-page-html-css-code","status":"publish","type":"post","link":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/","title":{"rendered":"Simple Landing Page HTML CSS Code"},"content":{"rendered":"

This HTML and CSS code snippet helps you to create a simple landing page layout with key features. The HTML code structures the page with sections for content and a header<\/a>, while the CSS code provides styling for a clean and responsive design. This code helps you quickly set up a professional-looking landing page for your website.<\/p>\n

You can use this code to create a simple and attractive landing page for your website. It’s beneficial for businesses, startups, or personal projects as it offers a clean and professional design.<\/p>\n

How to Create a Simple Landing Page Using HTML and CSS<\/h2>\n

1. Start by copying the HTML. Create two separate files, one for HTML (e.g., index.html<\/code>) and another for CSS (e.g., style.css<\/code>). Make sure to save them in the same directory. Copy the following HTML code and paste it inside the index.html<\/code> file. Replace the sample content with your own.<\/p>\n

<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n    <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n    <script src=\"https:\/\/kit.fontawesome.com\/d92630495d.js\" crossorigin=\"anonymous\"><\/script>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@200;400;500;700&display=swap\" rel=\"stylesheet\"> \r\n<\/head>\r\n<body>\r\n    <main>\r\n        <div id=\"image-section\">\r\n            <nav id=\"social-media\">\r\n                <ul>\r\n                    <li>\r\n                        <a href=\"#\"><i class=\"fa-brands fa-facebook\"><\/i><\/a>\r\n                    <\/li>\r\n                    <li>\r\n                        <a href=\"#\"><i class=\"fa-brands fa-instagram\"><\/i><\/a>\r\n                    <\/li>\r\n                    <li>\r\n                        <a href=\"#\"><i class=\"fa-brands fa-twitter\"><\/i><\/a>\r\n                    <\/li>\r\n                    <li>\r\n                        <a href=\"#\"><i class=\"fa-brands fa-youtube\"><\/i><\/a>\r\n                    <\/li>\r\n                <\/ul>\r\n                <\/nav>\r\n            <img class=\"header-image\" src=\"https:\/\/github.com\/malunaridev\/Landing-Pages-Are-Fun\/blob\/master\/1-business-agency-concept\/assets\/image.png?raw=true\" alt=\"a business woman and man standing back to back to each other and smiling\">\r\n        <\/div>\r\n        <div id=\"content\">\r\n            <div id=\"contentnav\">\r\n                <nav id=\"navmenu\">\r\n                    <ul>\r\n                        <li>\r\n                            <a href=\"#\">Home<\/a>\r\n                        <\/li>\r\n                        <li>\r\n                            <a href=\"#\">Info<\/a>\r\n                        <\/li>\r\n                        <li>\r\n                            <a href=\"#\">Offer<\/a>\r\n                        <\/li>\r\n                        <li>\r\n                            <a href=\"#\">Contact<\/a>\r\n                        <\/li>\r\n                    <\/ul>  \r\n                <\/nav>\r\n                <img class=\"logo\" src=\"https:\/\/github.com\/malunaridev\/Landing-Pages-Are-Fun\/blob\/master\/1-business-agency-concept\/assets\/logo.png?raw=true\" alt=\"geometric logotype\">\r\n            <\/div>  \r\n            <div id=\"content-text\">\r\n                <h1>Business <br> agency<\/h1>\r\n                <h2>Lorem ipsum dolor sit amet, consectetur <br> \r\n                    adipisicing elit pariatur quibusdam <br> \r\n                    voluptatem pariatur dolore.<\/h2>\r\n                <button>Learn More<\/button>\r\n            <\/div>\r\n            <div id=\"footer\">\r\n                <div id=\"contacts\">\r\n                    <div id=\"phone\">\r\n                        More Information call us <br>\r\n                        <span>+91-878787-12345<\/span>\r\n                    <\/div>\r\n                    <div id=\"adress\">\r\n                        Av. Lorem ipsum dolor, 2045 <br>\r\n                        Dolor sit Amet - Adress<\/span>\r\n                    <\/div>\r\n                <\/div>  \r\n                <div class=\"icons\">\r\n                    <i class=\"fa-solid fa-mobile-screen\"><\/i>\r\n                    <i class=\"fa-solid fa-location-dot\"><\/i>\r\n                <\/div>               \r\n            <\/div>\r\n        <\/div>\r\n    <\/main>\r\n    \r\n<\/body>\r\n<\/html><\/pre>\n
2. Now, copy the following CSS code and paste it inside the style.css<\/code> file. If you want to further customize the styling of your landing page, you can modify the CSS rules. This CSS code provides basic styling, but you can modify the colors, fonts, and layout to match your branding.<\/p>\n
* {\r\n  box-sizing: border-box;\r\n}\r\n\r\nbody {\r\n  background: #fdfdff;\r\n  margin: 0;\r\n}\r\n\r\nmain {\r\n  width: 100%;\r\n  display: flex;\r\n  justify-content: space-between;\r\n}\r\n\r\n#image-section {\r\n  min-height: 100vh;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 15rem;\r\n}\r\n\r\n#social-media ul {\r\n  font-size: 7rem;\r\n  list-style-type: none;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  padding-left: 2rem;\r\n}\r\n\r\n#social-media i {\r\n  color: #7fdbbb;\r\n  border: 0.2rem solid #7fdbbb;\r\n  padding: 0.5rem;\r\n  border-radius: 6rem;\r\n  list-style-type: none;\r\n}\r\n\r\n.header-image {\r\n  height: 100vh;\r\n}\r\n\r\n#content {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-end;\r\n  justify-content: space-between;\r\n  margin-right: 3rem;\r\n  margin-left: 3rem;\r\n}\r\n\r\n#contentnav {\r\n  display: flex;\r\n  justify-content: flex-end;\r\n  gap: 5rem;\r\n  padding-top: 3rem;\r\n  padding-right: 3rem;\r\n}\r\n\r\n#navmenu ul {\r\n  display: flex;\r\n  justify-content: space-evenly;\r\n  gap: 3rem;\r\n}\r\n\r\n#navmenu li {\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-weight: 500;\r\n  font-size: 2.7rem;\r\n  list-style-type: none;\r\n}\r\n\r\n#navmenu li a {\r\n  color: #303c4e;\r\n  text-decoration: none;\r\n}\r\n\r\n#navmenu li a:hover {\r\n  color: #7fdbbb;\r\n  font-weight: 600;\r\n  cursor: pointer;\r\n  transition: 0.5s;\r\n}\r\n\r\n.logo {\r\n  height: 5vh;\r\n}\r\n\r\n#content-text {\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-size: 3rem;\r\n  text-align: end;\r\n  padding-right: 3rem;\r\n}\r\n\r\nh1 {\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-size: 8rem;\r\n  line-height: 7rem;\r\n  color: #303c4e;\r\n  margin-bottom: 3rem;\r\n}\r\n\r\nh2 {\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-weight: 300;\r\n  font-size: 2rem;\r\n  line-height: 2.5rem;\r\n  width: 40rem;\r\n}\r\n\r\nbutton {\r\n  background-color: #7fdbbb;\r\n  padding: 0.5rem 2rem;\r\n  border: 0.1rem solid #7fdbbb;\r\n  border-radius: 4rem;\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-size: 1.5rem;\r\n  font-weight: 600;\r\n  color: #303c4e;\r\n  transition: 0.5s ease;\r\n}\r\n\r\nbutton:hover {\r\n  background-color: #50b893;\r\n  cursor: pointer;\r\n  color: white;\r\n  transition: 0.5s;\r\n}\r\n\r\n#footer {\r\n  display: flex;\r\n  padding-right: 3rem;\r\n  padding-bottom: 3rem;\r\n}\r\n\r\n#contacts {\r\n  text-align: end;\r\n  padding-right: 0.7rem;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  gap: 2rem;\r\n}\r\n\r\n#phone,\r\n#adress {\r\n  font-family: \"Poppins\", sans-serif;\r\n  font-weight: 400;\r\n  font-size: 1.8rem;\r\n  line-height: 2.1rem;\r\n  color: #303c4e;\r\n}\r\n\r\n#phone span {\r\n  font-size: 1.9rem;\r\n  font-weight: 600;\r\n  color: #7fdbbb;\r\n  letter-spacing: 0.2rem;\r\n}\r\n\r\n.icons {\r\n  font-size: 6rem;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  gap: 2rem;\r\n}\r\n\r\n\r\n@media (max-width: 600px) {\r\n  * {\r\n    font-size: 60%;\r\n  }\r\n  \r\n main {\r\n    flex-direction: column-reverse;\r\n    width: auto;\r\n  }\r\n\r\n  #content {\r\n    margin-right: 0rem;\r\n  }\r\n\r\n  .logo {\r\n    height: 4rem;\r\n    margin-top: 5rem;\r\n  }\r\n\r\n#contentnav {\r\n  width: 40rem;\r\n  flex-direction: column;\r\n  align-items: flex-end;\r\n  gap: 1rem;\r\n  padding-top: 3rem;\r\n}\r\n\r\n#navmenu ul {\r\n  justify-content: flex-end;\r\n  padding-left: 2rem;\r\n}\r\n\r\n#navmenu li + li {\r\n  margin-left: 2rem;\r\n}\r\n\r\nh1 {\r\n  font-size: 7rem;\r\n}\r\n\r\nbutton {\r\n  margin-bottom: 3rem;\r\n}\r\n\r\n.header-image {\r\n  height: auto;\r\n  width: 33rem;\r\n  opacity: .5;\r\n}\r\n\r\n#image-section {\r\n  min-height: 0vh;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  gap: 0rem;\r\n  \r\n} \r\n  \r\n}<\/pre>\n
That’s all! hopefully, you have successfully created a Simple Landing Page using this HTML and CSS code. If you have any questions or suggestions, feel free to comment below.<\/p>\n","protected":false},"excerpt":{"rendered":"
This HTML and CSS code snippet helps you to create a simple landing page layout with key features. The HTML…<\/p>\n","protected":false},"author":1,"featured_media":9137,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[63],"tags":[],"class_list":["post-9118","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html5-css3"],"acf":[],"yoast_head":"\nSimple Landing Page HTML CSS Code — CodeHim<\/title>\n<meta name=\"description\" content=\"Here is a free code snippet to create a Simple Landing Page HTML CSS Code. You can view demo and download the source code.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Simple Landing Page HTML CSS Code — CodeHim\" \/>\n<meta property=\"og:description\" content=\"Here is a free code snippet to create a Simple Landing Page HTML CSS Code. You can view demo and download the source code.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\" \/>\n<meta property=\"og:site_name\" content=\"CodeHim\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codehimofficial\" \/>\n<meta property=\"article:published_time\" content=\"2024-01-19T17:59:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-01-22T10:59:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"960\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Asif Mughal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@CodeHimOfficial\" \/>\n<meta name=\"twitter:site\" content=\"@CodeHimOfficial\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Asif Mughal\" \/>\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:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\"},\"author\":{\"name\":\"Asif Mughal\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\"},\"headline\":\"Simple Landing Page HTML CSS Code\",\"datePublished\":\"2024-01-19T17:59:00+00:00\",\"dateModified\":\"2024-01-22T10:59:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\"},\"wordCount\":233,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png\",\"articleSection\":[\"HTML5 & CSS3\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\",\"url\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\",\"name\":\"Simple Landing Page HTML CSS Code — CodeHim\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png\",\"datePublished\":\"2024-01-19T17:59:00+00:00\",\"dateModified\":\"2024-01-22T10:59:34+00:00\",\"description\":\"Here is a free code snippet to create a Simple Landing Page HTML CSS Code. You can view demo and download the source code.\",\"breadcrumb\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage\",\"url\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png\",\"contentUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png\",\"width\":1280,\"height\":960,\"caption\":\"Simple Landing Page HTML CSS Code\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/codehim.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HTML5 & CSS3\",\"item\":\"https:\/\/codehim.com\/category\/html5-css3\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Simple Landing Page HTML CSS Code\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codehim.com\/#website\",\"url\":\"https:\/\/codehim.com\/\",\"name\":\"CodeHim\",\"description\":\"Web Design Code Snippets\",\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"alternateName\":\"Web Design Codes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codehim.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/codehim.com\/#organization\",\"name\":\"CodeHim - Web Design Code & Scripts\",\"url\":\"https:\/\/codehim.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/logo\/image\/\",\"url\":\"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg\",\"contentUrl\":\"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg\",\"width\":280,\"height\":280,\"caption\":\"CodeHim - Web Design Code & Scripts\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/codehimofficial\",\"https:\/\/x.com\/CodeHimOfficial\",\"https:\/\/www.instagram.com\/codehim\/\",\"https:\/\/www.linkedin.com\/company\/codehim\",\"https:\/\/co.pinterest.com\/codehim\/\",\"https:\/\/www.youtube.com\/@codehim\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\",\"name\":\"Asif Mughal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g\",\"caption\":\"Asif Mughal\"},\"description\":\"I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences. I truly enjoy what I'm doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.\",\"sameAs\":[\"https:\/\/codehim.com\"],\"url\":\"https:\/\/codehim.com\/author\/asif-mughal\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Simple Landing Page HTML CSS Code — CodeHim","description":"Here is a free code snippet to create a Simple Landing Page HTML CSS Code. You can view demo and download the source code.","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:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/","og_locale":"en_US","og_type":"article","og_title":"Simple Landing Page HTML CSS Code — CodeHim","og_description":"Here is a free code snippet to create a Simple Landing Page HTML CSS Code. You can view demo and download the source code.","og_url":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/","og_site_name":"CodeHim","article_publisher":"https:\/\/www.facebook.com\/codehimofficial","article_published_time":"2024-01-19T17:59:00+00:00","article_modified_time":"2024-01-22T10:59:34+00:00","og_image":[{"width":1280,"height":960,"url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png","type":"image\/png"}],"author":"Asif Mughal","twitter_card":"summary_large_image","twitter_creator":"@CodeHimOfficial","twitter_site":"@CodeHimOfficial","twitter_misc":{"Written by":"Asif Mughal","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#article","isPartOf":{"@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/"},"author":{"name":"Asif Mughal","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed"},"headline":"Simple Landing Page HTML CSS Code","datePublished":"2024-01-19T17:59:00+00:00","dateModified":"2024-01-22T10:59:34+00:00","mainEntityOfPage":{"@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/"},"wordCount":233,"commentCount":0,"publisher":{"@id":"https:\/\/codehim.com\/#organization"},"image":{"@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png","articleSection":["HTML5 & CSS3"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/","url":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/","name":"Simple Landing Page HTML CSS Code — CodeHim","isPartOf":{"@id":"https:\/\/codehim.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage"},"image":{"@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png","datePublished":"2024-01-19T17:59:00+00:00","dateModified":"2024-01-22T10:59:34+00:00","description":"Here is a free code snippet to create a Simple Landing Page HTML CSS Code. You can view demo and download the source code.","breadcrumb":{"@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#primaryimage","url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png","contentUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/10\/Simple-Landing-Page-HTML-CSS-Code.png","width":1280,"height":960,"caption":"Simple Landing Page HTML CSS Code"},{"@type":"BreadcrumbList","@id":"https:\/\/codehim.com\/html5-css3\/simple-landing-page-html-css-code\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/codehim.com\/"},{"@type":"ListItem","position":2,"name":"HTML5 & CSS3","item":"https:\/\/codehim.com\/category\/html5-css3\/"},{"@type":"ListItem","position":3,"name":"Simple Landing Page HTML CSS Code"}]},{"@type":"WebSite","@id":"https:\/\/codehim.com\/#website","url":"https:\/\/codehim.com\/","name":"CodeHim","description":"Web Design Code Snippets","publisher":{"@id":"https:\/\/codehim.com\/#organization"},"alternateName":"Web Design Codes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codehim.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/codehim.com\/#organization","name":"CodeHim - Web Design Code & Scripts","url":"https:\/\/codehim.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/#\/schema\/logo\/image\/","url":"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg","contentUrl":"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg","width":280,"height":280,"caption":"CodeHim - Web Design Code & Scripts"},"image":{"@id":"https:\/\/codehim.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codehimofficial","https:\/\/x.com\/CodeHimOfficial","https:\/\/www.instagram.com\/codehim\/","https:\/\/www.linkedin.com\/company\/codehim","https:\/\/co.pinterest.com\/codehim\/","https:\/\/www.youtube.com\/@codehim"]},{"@type":"Person","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed","name":"Asif Mughal","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g","caption":"Asif Mughal"},"description":"I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences. I truly enjoy what I'm doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.","sameAs":["https:\/\/codehim.com"],"url":"https:\/\/codehim.com\/author\/asif-mughal\/"}]}},"views":9638,"_links":{"self":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9118","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/comments?post=9118"}],"version-history":[{"count":0,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9118\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media\/9137"}],"wp:attachment":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media?parent=9118"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/categories?post=9118"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/tags?post=9118"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}