Writing Content Using HTML

Compose your manuscript by typing into the panel opposite. Use HTML tags to describe the semantic structure of your work.

For example:


<h2>
	This Is A Heading
</h2>
<p>
	This text is in the first paragraph.
</p>
<p>
	This text is contained in a second paragraph all of its own.
</p>

You can see your code transformed into the completed document by clicking on the Preview tab.

If you need some help finding the right HTML tag then click on

Don't include the following tags in your code: <!DOCTYPE>, <html>, <head>, <title>, <body>, <base>, <main> or <meta>. Web Page Editor will insert these automatically.

Improving Formatting using CSS

Change the formatting of your work by writing CSS code.

CSS code is written in blocks.
Each block begins with a selector, which describes which parts of the document need restyling.
Inside a block, each line includes:
1. a property name that describes which aspect of the formatting should be changed, and,
2. a property value, which gives the exact color, measurement, font name, etc.

For example:


h2 {
	background-color: rgb(255, 160, 120);
	font-family: cursive;
	padding: 5pt;
}

Changing Document Options

Libraries & Toolkits

Choose options from this section to attach third-party code to your document to help automate common tasks.

jQuery

For changing the document content and styling dynamically (e.g. in response to mouse clicks).
The slim build doesn't include any AJAX or animation effect functionality.
Documentation: jquery.com

Bootstrap

Gives documents a modern look that's consistent across different devices and browsers.
To enable everything Bootstrap is capable of providing choose the CSS + JS option and tick the Popper.js box.
Documentation: getbootstrap.com

Popper.js

Lets you add popover, drop-down and tooltip elements to your graphical user interface.
Can be used in combination with Bootstrap or standalone.
Documentation:

MathJax

MathJax lets you use the math commands from the LaTeX language to include equations and theorems in your documents. It also supports the amsmath and amssymb LaTeX extension packages.

Insert math inside a paragraph by writing it between two $ signs.


<p>
	Pythagoras's theorem, usually quoted as $a^2 = b^2 + c^2$, informs us that the square of the length of the hypotenuse of a right-angled triangle is equal to the sum of the squares of the other two side lengths.
</p>

Pythagoras's theorem, usually quoted as $a^2 = b^2 + c^2$, informs us that the square of the length of the hypotenuse of a right-angled triangle is equal to the sum of the squares of the other two side lengths.

Or place an equation on a line of its own using \begin{equation}… \end{equation}.


<p>
	The proof is via Pythagoras Theorem (Equation&nbsp;\ref{pythag}).
</p>

\begin{equation}\label{pythag}
	a^2 = b^2 + c^2
\end{equation}

The proof is via Pythagoras Theorem (Equation \ref{pythag}). \begin{equation}\label{pythag} a^2 = b^2 + c^2 \end{equation}

Using \ref and \label is optional. Use equation* in place of equation to avoid giving the equation an equation number.

If you need to include an actual \$ symbol in a document that uses MathJax then you'll need include a backslash before it to prevent the \$ sign from being interpreted as the beginning of a piece of math.


I rode the bus today and it cost me \$3.

Documentation: