Web Design 2021 for Beginners HTML CSS BOOTSTRAP 4 + Project

Learn HTML basics and its role as the dominant markup language for the web; understand that HTML stands for HyperText Markup Language and describes pages for browsers, not programming.

Discover the global structure of a web page by learning how the head and body sections organize content, meta data, and assets using elements like the title, h1, and p.

Explore headings from h1 to h6 to convey hierarchy, and learn to write paragraphs with the p tag; see how browsers space and structure content.

Learn how to create hyperlinks with the anchor tag, set href attributes, and use anchor text to navigate to other pages or to sections within the same page.

Create an html table with opening and closing tags, set a two-pixel border, and fill rows with data td and header th cells. Use colspan to span across 3 columns.

Learn to collect user input with HTML forms, using text, password, checkboxes, radio buttons, selects, text areas, and submit interactions with action and method attributes.

Understand html5 form input types, including text, submit, and tel, and how tel prompts a number pad on mobile browsers, while validation may not occur in this example.

Explore HTML5 form features, including input types and a submit button, and learn how mobile keyboards and URL validation improve accessibility and user input experience.

Explore how HTML5 number inputs enforce numeric data with input type=number, including min, max, and step attributes and the built-in spinner for selecting values.

Explore HTML5 input types date, date time, date time local, month, week, and time, and learn how they capture year, month, day, hours, minutes, time zone with varying browser support.

Learn how HTML5 input type=search creates a native search box that displays a Google-style search icon as you type, demonstrating the basic behavior of new form controls.

Embed an audio element in your website with an MP3 source and fallback text for browser support. Configure playback with controls, autoplay, looping, and multiple sources for maximum compatibility.

Master the basics of css to style web pages with color and display variations for different screens and devices, separate content from presentation, and apply style sheet to several pages.

Explore class selectors and id selectors in CSS, using dot for class names and pound symbol for IDs, apply multiple classes and unique IDs, and create anchors with fragment identifiers.

Explore how to control text appearance using font family, size, style, and weight in css, including font stacks, absolute and relative sizes, and common effects like italic and bold.

Understand the CSS box model and how content, padding, borders, and margins determine an element's size. Learn how width, height, and whitespace affect layout within a page.

Learn to style CSS borders using width, style, and color, explore per-side values, and apply the one-line shorthand border property for consistent results.

Learn how the CSS margin property creates space around an element, uses shorthand to set top, right, bottom, and left values (including negative values), and accepts lengths, percentages, or auto.

Learn how the CSS display property shapes layout by switching elements between block, inline, and inline-block, and control element heights for images, headings, links, and paragraphs.

Explore how the CSS position property controls layout with static, relative, absolute, and fixed values, and learn how parent and child elements interact using top, left, bottom, and right offsets.

Learn how flex items flow and resize with the flex shorthand, control their width and height, and set order, grow, shrink, and basis to shape a flex container.

Create a bootstrap 4 features section with a heading, paragraph, and a responsive four-icon row, centered with padding and secondary color.

Learn to build an about us section with the jumbotron component, center content in a Bootstrap container, and style headings, margins, padding, and buttons for a responsive page.

Learn to build a responsive services section using Bootstrap 4: structure with container and row, add four icon cards with headings, apply background color, and ensure responsiveness.

Build a blog section using Bootstrap 4 cards inside a responsive grid, featuring images, titles, and a read more button.

Create a responsive footer with three columns featuring the logo and description, contact info with icons, and an embedded Google Maps, then style with spacing and a gray background.