Typography
You can create some beautiful content by using some simple HTML elements. Mozen template offers some neat styles for all HTML elements and a great set of CSS classes to style your content. Basic HTML is very easy to learn and this small guide shows you how to use all styles provided by the Mozen theme.
Basic HTML Elements
Here is a short demonstration of text-level semantics.
The <p> element creates a new paragraph. It will have some space before and after itself.
To turn your text into hypertext just use the <a> element
Text-level semantics
You can emphasize text using the
<em> element
or to imply any extra importance the
<strong> element
. Highlight text with no semantic meaning using the [
mark
] element[
/mark
]. Markup document changes like inserted or deleted text with the
[
or
[
del
] element[
/del
]
ins
] element [
/ins
]
. To define an abbreviation use the
[
abbr
] element [
/abbr
]
and to define a definition term use the
[
dfn
] element [
/dfn
]
.
Basic Bullet List
-
Apple iPad
mj-bullet1 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet2 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet3 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet4 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet5 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet6 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet7 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet8 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet9 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-bullet10 - Apple iPod
- Apple iPod Nano
To use the bullet list style create a list in the following format
[listmj-bullet1][li]...[/li][li]...[/li][/list]
Featured Bullet List
-
Apple iPad
mj-special1 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special2 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special3 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special4 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special5 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special6 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special7 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special8 - Apple iPod
- Apple iPod Nano
-
Apple iPad
bullet-9 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special10 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special11 - Apple iPod
- Apple iPod Nano
-
Apple iPad
mj-special12 - Apple iPod
- Apple iPod Nano
To use the special list style create a list in the following format
[listmj-special1 ][ li ]... [/li] [li]... [/li][/list]
Default Headings
Lorem Ipsum dummy Text for H1.
Lorem Ipsum dummy Text for H2.
Lorem Ipsum dummy Text for H3.
Lorem Ipsum dummy Text for H4.
Lorem Ipsum dummy Text for H5.
Lorem Ipsum dummy Text for H6.
Text for H1 with dotted line.
Text for H2 with dotted line.
Text for H3 with dotted line.
Text for H4 with dotted line.
Text for H5 with dotted line.
Text for H6 with dotted line.
Content Highlighter
Drop caps are the first letter of a paragraph which are displayed bigger than the rest of the text. Can be used by using the CSS class
dropcap
. To emphasize text with some small boxes use
<em> element
with the CSS class
box
.
mj-boxcontent
]...[
/box
].
mj-boxnote
]...[
/box
].
mj-boxinfo
]...[
/box
].
mj-boxwarning
]...[
/box
].
mj-boxhint
]...[
/box
].
mj-boxdownload
]...[
/box
].
Button Style
Color Button
normal This is an expandable buttonTo use the buttons in your content use the following format:
[button href="#"] button text [/button]
Prev
