Styling Guide

This is a blockquote. You can fill with any text with this tag and here the result. Don’t forget to review all sentences. Verify its necessary.

Typography

We will show you about the typography approach. Here heading style.

Heading One

Heading Two

Heading Three

Heading Four

Heading Five
Heading Six

Mixed list items styling

  • Unordered list item one
  • Unordered list item two
    1. Ordered list item one
    2. Ordered list item two
      • Unordered list item one
      • Unordered list item two
        1. Ordered list item one
        2. Ordered list item two
        3. Ordered list item three
      • Unordered list item three
    3. Ordered list item three
  • Unordered list item three

Code formatting

.intro {
	border-bottom: solid 1px #eee;
	border-top: solid 1px #eee;
	text-transform: uppercase;
	display: inline-block;
	letter-spacing: 1px;
	text-align: center;
	font-size: 16px;
	padding: 20px 0;
	color: #aaa;
	margin: 0;
}

Blockquote styling

The blockquote is used to indicate the quotation of a large section of text from another source.

Don’t ever let somebody tell you can’t do something. You got a dream, you gotta protect it. People can’t do something themselves. They wanna tell you can’t do it. If you want something, GO GET IT. PERIOD.
– Will Smith

Table styling

Table is a collection of related data held in a structured format, it consists of fields (columns), and rows.

Table Standard

Year Number of wildfires Number of fires Total burned area (ha) Wildfires in other land
2007 6.691 603 4.636 6088
2006 8.658 608 6.463 8050
2008 6.639 502 2.404 6137
2010 3.120 109 878 3011
2011 8.436 2.021 8.055 6415

Table With Border and Striped

Year Number of wildfires Number of fires Total burned area (ha) Wildfires in other land
2007 6.691 603 4.636 6088
2006 8.658 608 6.463 8050
2008 6.639 502 2.404 6137
2010 3.120 109 878 3011
2011 8.436 2.021 8.055 6415

Image Styling

Gallery

Make sure you are linking to the Media file when creating gallery, not the attachment page.


forest-547363_1280
Right Aligned Image
Images may be two-dimensional, such as a photograph, screen display, and as well as a three-dimensional, such as a statue or hologram. They may be captured by optical devices – such as cameras, mirrors, lenses, telescopes, microscopes, etc. and natural objects and phenomena, such as the human eye or water surfaces.
Images may be two-dimensional, such as a photograph, screen display, and as well as a three-dimensional, such as a statue or hologram. They may be captured by optical devices – such as cameras, mirrors, lenses, telescopes, microscopes, etc. and natural objects and phenomena, such as the human eye or water surfaces.


forest-657903_1280
Left Aligned Image
The word image is also used in the broader sense of any two-dimensional figure such as a map, a graph, a pie chart, or an abstract painting. In this wider sense, images can also be rendered manually, such as by drawing, painting, carving, rendered automatically by printing or computer graphics technology.

The word image is also used in the broader sense of any two-dimensional figure such as a map, a graph, a pie chart, or an abstract painting. In this wider sense, images can also be rendered manually, such as by drawing, painting, carving, rendered automatically by printing or computer graphics technology.


Column

And do-wrongs dont make a right. Why on earth are you still reading this? Haven’t you realized it’s just dummy copy? How many times must you be reminded that its really not meant to be read? You’re only wasting precious time. But be that as it may, you’ve got to throw in a short paragraph from time to time. Here’s a short paragraph.This is dummy copy.

It’s Greek to you. Unless, of course, you’re Greek, in which case, it really makes no sense. Why, you can’t even read it! It is strictly for mock-ups. You may mock it up as strictly as you wish.

These words are here to provide the reader with a basic impression of how actual text will appear in its final presentation. Think of them merely as actors on a paper stage, in a performance devoid of content yet rich in form.

Meaningless mock-up, mock turtle soup spilled on a mock turtle neck. Mach I Convertible copy. To kill a mockingbird, you need only force it to read this copy. This is Meaningless filler. (Elvis movies.)

It is not meant to be a forum for value judgments nor a scholarly diatribe on how virtue should be measured.The whole point here (if such a claim can be made in an admittedly pointless paragraph) is that this is dummy copy.

Real bullets explode with destructive intensity. Such is not the case with dummy bullets. In fact, they don’t explode at all. Duds. Dull thuds.

But then, this is dummy copy. It is not meant to be read. Period.

<div class="row">
<div class="col-md-6">Your column 1.</div>
<div class="col-md-6">Your column 2.</div>
</div>

 

And do-wrongs dont make a right. Why on earth are you still reading this? Haven’t you realized it’s just dummy copy? How many times must you be reminded that its really not meant to be read? You’re only wasting precious time. But be that as it may, you’ve got to throw in a short paragraph from time to time. Here’s a short paragraph.This is dummy copy.

It’s Greek to you. Unless, of course, you’re Greek, in which case, it really makes no sense. Why, you can’t even read it! It is strictly for mock-ups. You may mock it up as strictly as you wish.

Meaningless mock-up, mock turtle soup spilled on a mock turtle neck. Mach I Convertible copy. To kill a mockingbird, you need only force it to read this copy. This is Meaningless filler. (Elvis movies.)

It is not meant to be a forum for value judgments nor a scholarly diatribe on how virtue should be measured.The whole point here (if such a claim can be made in an admittedly pointless paragraph) is that this is dummy copy.

Real bullets explode with destructive intensity. Such is not the case with dummy bullets. In fact, they don’t explode at all. Duds. Dull thuds.But then, this is dummy copy. It is not meant to be read. Period.

These words are here to provide the reader with a basic impression of how actual text will appear in its final presentation. Think of them merely as actors on a paper stage, in a performance devoid of content yet rich in form.

<div class="row">
<div class="col-md-4">Your column 1.</div>
<div class="col-md-4">Your column 2.</div>
<div class="col-md-4">Your column 3.</div>
</div>