Skip to content

Latest commit

 

History

History
69 lines (44 loc) · 1.96 KB

h6.md

File metadata and controls

69 lines (44 loc) · 1.96 KB

h6

Overview

Headings defines six levels of headings. The heading elements are H1, H2, H3, H4, H5, and H6 with H1 being the highest (or most important) level and H6 the least.

Usage

H6 component is used to display the sixth and the least important heading.

How to use

  1. Drag and drop the component.
  2. Double click the component to display the list of attributes that can be used with it.
  3. Fill the attributes which are needed and save the page.

Example

  1. Input the component field(s) with the attribute value(s):

    H6 Text = Heading 6

    Class = h6

  2. Save it and run.

  3. When the page is loaded the value "H6 Text = Heading 6", will be the heading that is displayed and "Class = h6" is the class name that can be used to point to a class in a style sheet.

Here is an example of how different headings from h1 to h6 looks like.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Associated Attributes

  • Style: It accepts a string value and affects the different properties (height, width, color etc.) of the component based on the values provided (eg. background:orange;height:200px;).

  • Class: "Class" attribute is used to point to a class in a style sheet. A class contains one or more style statements. Classes are created inside the "Style" tab which is opened by selecting the "Style" side menu. The "Class" attribute accepts space separated class names (eg. class1 class2) which are defined in the "Style" tab as shown below.

      .class1 {
          border-radius:10px;
          flex-basis:10%;
          height:100px;
      }
      .class2 {
          border-radius:10px;
          flex-basis:10%;
          height:100px;
      }
  • H6 Text: Specifies the text to be displayed inside the heading.

Support

  • Devices: Android, iOS
  • Browsers: Latest version of all modern browsers
  • Dependencies version:
    • Angular CLI version: 6.0.0 +
    • Cordova version: 7.1.0 +