Semantic HTML
| Name | Tag | Description |
|---|---|---|
| Header |
<header>
|
The <header> element defines
introductory content for its nearest sectioning element
|
| Nav | <nav> |
The <nav> element should contain
a set of navigational aids. This can include the main
navigation, related links, footer navigations, etc.
|
| Main | <main> |
The <main> element defines the
main content of a web page
|
| Section | <section> |
The <section> element is used to
group related content together. It can be used to explicitly
define a new section in the document outline
|
| Article | <article> |
The
<article> element is used to
group self-contained content together
|
| Aside | <aside> |
The <aside> element defines
content that is only slightly-related to the main content
|
| Figure | <figure> |
The <figure> element represents
self-contained media such as: images, illustrations, diagrams,
code snippets, etc. The media encapsulated inside of the
<figure> element can be accompanied by an
optional caption using the
<figcaption> element
|
| Footer | <footer> |
The
<footer> element creates a footer for its
nearest sectioning element. It should contain footer content
such as: footer navigations, copyright claims, terms of use,
etc.
|
CSS Properties
| Name | Property | Description |
|---|---|---|
| Font Size | font-size |
The font-size property is used to set
the font size of text on our web page. The value of the
font-size property can either be in
px, em,
rem and %
|
| Font Family | font-family |
The font-family property allows us to
change the typeface of text on our web page
|
| Font Weight | font-weight |
The font-weight property allows us to control the
thickness of text
|
| Color | color |
The color property allows to modify
the foreground color of text on our web page
|
| BG Color | background-color |
The background-color property allows us to change
the background color of an element
|
| Text Align | text-align |
The text-align property is used to align text or
inline/inline-block elements to the left, right or center of
their parent
|
| Opacity | opacity |
The opacity property controls how transparent or
opaque an element is
|
| BG Image | background-image |
The background-image property allows us to set the
background of an element to be an image
|