Standard Markdown Syntax
# Heading1## Heading2
### Heading3
#### Heading4
##### Heading5
*Italics*
**Bold**
***Bold Italics***
Bullet List
* item (single asterisk followed by a space)
Note: To show an asterisk '\*'
Images:
![image description ] (imagefile )
Link
[link name] (link url)
Image Link
[](link url )
body {
font-family: sans-serif;
margin: 20px auto;
width: 800px;
}
h1 {
text-align: center;
}
main {
max-width: 100%;
box-sizing: border-box;
}
Standard Markdown Syntax
# Heading1## Heading2
### Heading3
#### Heading4
##### Heading5
*Italics*
**Bold**
***Bold Italics***
Bullet List
* item (single asterisk followed by a space)
Bullet List
- item (single dash followed by a space)
Note: To show an asterisk in the text, use '\*'
Leave extra space if at end of paragraph
Images:
![image description ] (imagefile )
Link
[link name] (link url)
Image Link
[](link url )
Shortcodes
Image sizes and justification![image description ] (imagefile RIGHT )
![image description ] (imagefile LEFT )
![image description ] (imagefile LEFT SMALL )
Image sizes:
XSMALL: 100px, SMALL: 180px, MEDUIM: 300px, LARGE: 450px, XLARGE: 700px
Image with Caption:
%%This is a caption/%%
Quote
[QUOTE]Quoted text[ENDQUOTE]
Style
[STYLE](class name)Text to be styled [ENDSTYLE]
Color
[COLOR](Color code or name)Text to be colored[ENDCOLOR]
Break from left or right float
[BREAK]
Single blank line
[BLANKLINE]
Multiple blank lines
[BLANKLINES](number of blank lines)
2 Columns:
[2COL1]Text[2COL2]Text [ENDCOL]
3 Columns:
[3COL1]Text[3COL2]Text[3COL3]Text[ENDCOL]
2/3 Columns:
[23COL1]Text[3COL3] Text [ENDCOL]
[3COL1]Text[23COL2] Text [ENDCOL]
body {
font-family: sans-serif;
margin: 20px auto;
width: 800px;
}
h1 {
text-align: center;
}
header {
margin: auto;
text-align: center;
}
main {
text-align: left;
margin: auto;
max-width: 100%;
margin-top: 30px;
width: 1100px;
}
img {
max-width: 100%;
}
.half-column-1, .half-column-2, .third-column-1, .third-column-2, .third-column-3, .two-thirds-column-1, .two-thirds-column-2 {
margin-top: 30px;
display: inline-block;
box-sizing: border-box;
vertical-align: top;
margin: 5px 0;
padding: 10px;
max-width: 100%;
}
.half-column-1, .half-column-2 {
width: 45%;
margin: 5px;
}
.third-column-1, .third-column-2, .third-column-3 {
width: 30%;
padding: 10px;
}
.two-thirds-column-1, two-thirds-column-2 {
width: 66%;
}
.grey-background {
background-color: #eee;
padding: 20px;
}
figure img {
padding: 0;
}
figure {
padding: 20px;
}
.image-center {
margin: 0 auto;
float: none;
}
.image-right {
float: right;
margin: 0;
}
.image-left {
float: left;
margin: 0;
}
.image-xsmall {
max-width: 140px;
}
.image-small {
max-width: 240px;
}
.image-medium {
max-width: 400px;
}
.image-large {
max-width: 600px;
}
.image-xlarge {
width: 700px;
}
/** BREAKPOINTS */
@media only screen and (max-width: 750px) {
.two-thirds-column-1, .two-thirds-column-2, .third-column-1, .third-column-2 , .third-column-3, .half-column-1, .half-column-2 {
width: 100%;
}
.image-right, .image-left {
float: none;
}
}