{"id":8485,"date":"2020-10-23T13:44:49","date_gmt":"2020-10-23T13:44:49","guid":{"rendered":"https:\/\/oxhosting.com\/blog\/2020\/10\/23\/create-a-responsive-web-site-html-css-grid-flexbox-more\/"},"modified":"2020-10-23T13:44:49","modified_gmt":"2020-10-23T13:44:49","slug":"create-a-responsive-web-site-html-css-grid-flexbox-more","status":"publish","type":"post","link":"https:\/\/oxhosting.com\/blog\/2020\/10\/23\/create-a-responsive-web-site-html-css-grid-flexbox-more\/","title":{"rendered":"Create a Responsive Web-site | HTML, CSS Grid, Flexbox &#038; More"},"content":{"rendered":"<p><iframe loading=\"lazy\"  width=\"580\" height=\"385\" src=\"https:\/\/www.youtube.com\/embed\/p0bGHP-PXD4?rel=0&#038;cc_load_policy=1&#038;modestbranding=1\" frameborder=\"0\" allowfullscreen><\/iframe><br \/>\n<br \/>In this job we will construct a tailor made web site employing HTML5 and modern CSS techniques these as CSS Grid, Flexbox, psuedo selectors, animation and a lot more. We will also deploy to Netlify and add form operation<\/p>\n<p>Code:<\/p>\n<p>\ud83d\udc96  Help The Channel!<\/p>\n<p>Web site &#038; Brad Traversy Udemy System Back links:<\/p>\n<p>Comply with Traversy Media:<\/p>\n<p>Timestamps:<br \/>\n:00 &#8211; Intro<br \/>\n2:32 &#8211; Base &#038; Navbar HTML<br \/>\n6:05 &#8211; Base CSS<br \/>\n9:08 &#8211; Navbar, Container, Flex<br \/>\n16:12 &#8211; Showcase Space &#038; Grid<br \/>\n27:28 &#8211; Card &#038; Form CSS<br \/>\n33:07 &#8211; Button Styles<br \/>\n35:45 &#8211; Skewed Space<br \/>\n39:42 &#8211; Stats Portion<br \/>\n44:16 &#8211; Utility Courses &#8211; Margin &#038; Padding<br \/>\n52:33 &#8211; CLI Section &#038; Grid Col &#038; Row Span<br \/>\n57:25 &#8211; Cloud Portion<br \/>\n1:00:50 &#8211; History &#038; Button Utility Classes<br \/>\n1:04:00 &#8211; Text Sizes<br \/>\n1:05:28 &#8211; Languages Segment<br \/>\n1:09:49 &#8211; Footer<br \/>\n1:14:08 &#8211; Media Queries &#038; Responsiveness<br \/>\n1:21:34 &#8211; Options Site<br \/>\n1:29:57 &#8211; Functions Grid With Spans<br \/>\n1:32:15 &#8211; Docs Website page<br \/>\n1:42:44 &#8211; Inform, Code Block &#038; Textual content Color Types<br \/>\n1:49:02 &#8211; Make Internal Web pages Responsive<br \/>\n1:52:02 &#8211; Animations<br \/>\n1:56:42 &#8211; Get ready &#038; Deploy To Netlify<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In this job we will construct a tailor made web site employing HTML5 and modern CSS techniques these as CSS Grid, Flexbox, psuedo selectors, animation&#8230;<\/p>\n","protected":false},"author":227,"featured_media":8486,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[2],"tags":[42,834,6472,6469,6466,6468,6470,833,6465,6471,6473,6467],"_links":{"self":[{"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/posts\/8485"}],"collection":[{"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/users\/227"}],"replies":[{"embeddable":true,"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/comments?post=8485"}],"version-history":[{"count":0,"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/posts\/8485\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/media\/8486"}],"wp:attachment":[{"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/media?parent=8485"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/categories?post=8485"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/oxhosting.com\/blog\/wp-json\/wp\/v2\/tags?post=8485"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}