Forms, Positioning, and Layout with CSS3


Overview/Description
Target Audience
Prerequisites
Expected Duration
Lesson Objectives
Course Number
Expertise Level


Overview/Description
Forms are key components for many web sites and CSS3 has a range of options for configuring form elements. CSS3 also includes positioning and layout options to optimize your site presentation. In this course you will learn how to apply CSS3 to forms, how to use positioning features of CSS3 and how to use CSS3 columns and the CSS3 box model for layout.

Target Audience
Web developers who want to learn how to use the features of CSS3

Prerequisites
None

Expected Duration (hours)
1.9

Lesson Objectives

Forms, Positioning, and Layout with CSS3

  • start the course
  • use CSS to style a form
  • use CSS to style Submit buttons
  • insert images in form fields using CSS
  • use CSS to highlight fields when they gain focus
  • use CSS to style form fields according to the validity of their input
  • use CSS to group related fields in a form
  • use CSS to style a range slider on a form
  • use CSS to style a short form as a paragraph with inline fields
  • use CSS to modify form input
  • contrast how block and inline elements display
  • use CSS to implement static and fixed positioning of elements
  • contrast fixed and relative positioning and use CSS to implement relative positioning of elements
  • specify the stacking order with z-index
  • contrast the CSS margin and padding properties
  • use CSS to wrap text around an element
  • use CSS to overlap text on an image
  • use CSS to implement floating elements in your layout
  • use the CSS clear property to improve presentation of other elements after floated elements
  • overlap divs using CSS3
  • use CSS margin auto value to center a layout horizontally and auto value, absolute value and declared height for vertical centering
  • use CSS techniques to create a thumbnails gallery
  • use CSS to create a column layout
  • use CSS box model to create a layout
  • use the CSS box-sizing property
  • practice working with layouts using CSS3

    • Course Number:
    wd_cssh_a04_it_enus

    Expertise Level
    Intermediate