HTML and CSS Courses and Tutorials

Discover how meta tags in the head define document metadata for search engine optimization, including charset utf-8, author, keywords, viewport, and refresh for responsive pages.

Learn to use HTML5 heading tags h1 through h6 to structure content and control size with hands-on examples writing h1, h2, h3, and beyond.

Explore how HTML5 paragraphs define blocks of text and vary with capital or small letters, including examples with small caps and 100-character paragraphs.

Explore HTML5 comments, including single-line and multi-line formats, using <!-- --> between elements, and learn that comments provide information without rendering on the page.

Learn how to create HTML5 links, use the target attribute to open in the same page or a new tab, and link to internal pages with anchors.

Explore HTML5 text formatting by applying bold and italic styles, using inline elements like small, sub, and sup, and formatting text into paragraphs with links.

Explore using the div tag as a container, add a paragraph and an h1 inside, and include an image with a src attribute, then nest elements with additional divs.

HTML5 attributes provide additional information about elements, with image attributes such as src, alt, title, height, and width in pixels, and a title displays on hover.

Learn how to apply HTML5 inline CSS via the style attribute to change colors and backgrounds on tags and paragraphs, creating blue, green, and yellow styles.

Learn how HTML block elements start on a new line and occupy full width, using headings and paragraphs to structure text. See how h1 and p tags control page layout.

Explore how inline elements differ from block elements, taking only the necessary space and not starting new lines, with examples like italic, bold, link, and image.

Explore HTML5 forms, using the action and method attributes to submit data via post and get, with text inputs and a submit button.

Learn how to pair label and input elements in HTML forms, matching the label for attribute to the input, and using placeholders for text inputs to improve usability.

Explore input type date and input type file in HTML forms, including selecting dates, uploading files, and using the multiple attribute for uploading several items.

Create and label a group of radio inputs in HTML to let users select one option, such as male, female, or other, using a shared name and accompanying labels.

Explore input type checkbox to select multiple options, build labeled checkboxes, and compare them with radio buttons that allow only one choice.

Explore how to use the disabled and checked attributes to control checkbox states in HTML, including enabling and disabling checkboxes and reflecting changes after refresh.

Learn to build a select dropdown in HTML by creating a container div, adding a prompt paragraph, and defining option tags with a title option using selected and disabled.

Explore how optgroup tags organize a select dropdown into labeled groups, using the label attribute to separate electronics and non electronic options.

Learn how to use textarea and input type password in html, create labels, and set name attributes, while adjusting columns, rows, and height for proper layout.

Learn how input type submit and input type reset work in HTML forms, sending data to the browser and recording data without submitting.

Learn to implement HTML video elements with controls, using the video element's source attribute and the nested source element, and use autoplay and loop attributes to manage playback.

Learn how to implement html video and audio elements with controls, using the source attribute or a nested source element for playback, including autoplay and loop.

Explore the introduction to cascading stylesheets and how CSS controls how HTML elements display on webpages and other media, with external stylesheets stored in CSS files.

Apply inline styles to headings and paragraphs to set color and background color, experiment with colors like blue, white, green, and brown, and explore multiple text and background states.

Learn internal css3 styling by adding style tags to the body, h1, and paragraphs, then set background colors, text colors, font size, and text transform to uppercase.

Learn to create and link an external css file in the head, then style the page with blue body, white h1, centered text, sans-serif font, yellow paragraphs, and padding.

Explore the css box model by building styled boxes with height, padding, borders in black and yellow, applying these ideas to paragraph elements to visualize the box.

Explore hexadecimal colors in HTML and CSS by applying red, green, and blue values to background and text, and style elements like headings and paragraphs using #ff0000, #00ff00, and #0000ff.

Learn how RGB color values define red, green, and blue intensities from 0 to 255 to style backgrounds and text in HTML and CSS.

Explore rgba colors by adjusting red, green, blue and the alpha channel to control opacity, and see how background color changes with different opacity levels.

Learn to apply CSS selectors, starting with the universal selector and element selectors, to a simple website, changing background color, text color, alignment, and text transform.

Apply id and class selectors to style HTML elements, changing background color and text color, center aligning text, and transforming text to uppercase through practical class-based examples.

Master CSS combined selectors by styling a paragraph and a three-item list using element selectors, ul and li, and changing background and text colors to show selector effects.

Explore css pseudo-class selectors by styling paragraphs and navigation links, adjusting background color, margins, padding, and transitions for a clean navigation.

Learn to style hover, visited, and active links with color changes, eight-pixel padding, and font size adjustments. See purple and gold hover states and black active links.

Learn how to use pseudo-element selectors to style the first letter and first line of text. Change background colors, text colors, and font size for this targeted typography.

Learn how before and after pseudo-element selectors style content by placing images and text on separate lines in HTML and CSS.

Leverage semantic tags and a header tag to structure with links, then set margins to zero, padding to seven pixels, 22-pixel font, black background, white text, and blue links.

Explore the section and article semantic tags in HTML, build article blocks with paragraphs, and apply padding, background color (yellow), and font size (18px) to create structured content.

Model a layout using the aside semantic tag and article in a flex container, with a div wrapper, Rebecca Purple background, white text, and 8px padding for a side-by-side layout.

Explore semantic tags like footer and section to structure content, style copy and lists, and implement colors, padding, and responsive layouts for accessible web pages.