CSS Basic User Interface Module Level 3 (CSS3 UI)

You can apply styles to HTML documents.

The CSS3 version has caused changes in the Selector, Color, Web Form, and Fonts CSS modules. In addition, the CSS3 UI API also handles changes related to the following user interface items:

• User interface selectors

  The CSS Selector is an essential module for applying a CSS to HTML in order to enable the DOM element selection. The pseudo-element selectors can be used to assign the user interface state. With the selectors, you can change the Web form style according to the user input without using JavaScript.

• Box model properties

  A box model refers to all DOM elements excluding design elements, such as <br> and <i>. The box model area is set as defined in the following figure.

  • Content: Content area
  • Padding: Gap between the content and boundary
  • Border: Boundary
  • Margin: Overall size of the box model

  Figure: Box model structure

  

  You can use the box model properties to assign styles to the selected DOM elements:

  • The box-sizing property assigns the box size range.
  • The outline properties make the box outstanding.
  • The text-overflow property handles the text extending outside the box.