HTML tags in CSE

a

<a href="https://www.w3schools.com">Visit W3Schools.com!</a>

Visit W3Schools.com!

abbr

<p>The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.</p>

The WHO was founded in 1948.

acronym

Can I get this <acronym title="as soon as possible">ASAP</acronym>?

Can I get this ASAP?

b

<b>Text</b>

Text

bdi

<ul>
<li>User <bdi>hrefs</bdi>: 60 points</li>
<li>User <bdi>إيان</bdi>: 90 points</li>
</ul>

• User hrefs: 60 points

• User إيان: 90 points

bdo

<p>This paragraph will go left-to-right.</p>
<p><bdo dir="rtl">This paragraph will go right-to-left.</bdo></p>

This paragraph will go left-to-right.

This paragraph will go right-to-left.

big

<p>This text is normal.</p>
<p><big>This text is bigger.</big></p>

This text is normal.

This text is bigger.

br

<b>Text</b><br>

Text¶

cite

<img src="img_the_scream.jpg" width="220" height="277" alt="The Scream">
<p><cite>The Scream</cite> by Edward Munch. Painted in 1893.</p>

The Scream by Edward Munch. Painted in 1893.

code

<code>A piece of computer code</code><br>

del

<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>

My favorite color is blue red!

dfn

<p><dfn>HTML</dfn> is the standard markup language for creating web pages.</p>

HTML is the standard markup language for creating web pages.

em

<em>Text</em>

Text

font

<font color=#FF0000>Text</font>

Text

i

<i>Text</i>

Text

img

<img src="img_the_scream.jpg" width="220" height="277" alt="The Scream">

ins

<p>My favorite color is <del>blue</del> <ins>red</ins>!</p>

My favorite color is blue red!

kbd

<kbd>Keyboard input</kbd><br>

label

<form action="/action_page.php">
<label for="bmw">BMW</label>
<input type="radio" name="car" id="bmw" value="bmw"><br>
</form>

BMW

map

<p>Click on the sun or on one of the planets to watch it closer:</p>

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>

Click on the sun or on one of the planets to watch it closer:

mark

<p>Do not forget to buy <mark>milk</mark> today.</p>

p

<p>Text</p>

<b>Text</b>

Text

Text

pre

<pre>Text Text Text

Text Text

Text</pre>

Text Text Text

Text Text

Text

q

<p>Julius Cesar said:
<q>Veni Vidi Vici.</q>
A great sentence.</p>

Julius Cesar said: Veni Vidi Vici. A great sentence.

ruby

<ruby>
漢 <rt> ㄏㄢˋ </rt>
</ruby>

rp

<ruby>
漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt>
</ruby>

rt

<ruby>
漢 <rt> ㄏㄢˋ </rt>
</ruby>

s

<p><s>My car is blue.</s></p>
<p>My new car is silver.</p>

My car is blue.

My new car is silver.

samp

<samp>Sample output from a computer program</samp><br>

small

<p>W3Schools.com - the world's largest web development site.</p>
<p><small>Copyright 1999-2050 by Refsnes Data.</small></p>

W3Schools.com - the world's largest web development site.

Copyright 1999-2050 by Refsnes Data.

span

<p>Text1: <span style="color:blue;font-weight:bold">blue</span>,

Text2: <span style="color:green;font-weight:bold">green</span></p>

Text1: blue, Text2: green

strike

<p>Version 2.0 is <strike>not yet available!</strike> now available!</p>

Version 2.0 is not yet available! now available!

strong

<strong>Text</strong>

Text

sub

_Text

_Text

sup

^Text

^Text

time

<p>We open at <time>10:00</time> every morning.</p>

<p>I have a date on <time datetime="2008-02-14 20:00">Valentines day</time>.</p>

<p><b>Note:</b> The time element does not render as anything special in any of the major browsers.</p>

We open at 10:00 every morning.

I have a date on Valentines day.

Note: The time element does not render as anything special in any of the major browsers.

tt

<p>This text is normal.</p>
<p><tt>This text is teletype text.</tt></p>

This text is normal.

This text is teletype text.

u

<u>Text</u>

Text

var

<var>Variable</var>

address

<address>
Written by <a href="mailto:webmaster@example.com">Jon Doe</a>.<br>
Visit us at:<br>
Example.com<br>
Box 564, Disneyland<br>
</address>

Written by Jon Doe.
Visit us at:
Example.com
Box 564, Disneyland

article

<article>
<h1>Google Chrome</h1>
<p>Google Chrome is a free, open-source web browser developed by Google, released in 2008.</p>
</article>

Google Chrome

Google Chrome is a free, open-source web browser developed by Google, released in 2008.

aside

<p>My family and I visited The Epcot center this summer.</p>

<aside>
<h4>Epcot Center</h4>
<p>The Epcot Center is a theme park in Disney World, Florida.</p>
</aside>

My family and I visited The Epcot center this summer.

Epcot Center

The Epcot Center is a theme park in Disney World, Florida.

blockquote

<p>Here is a quote from WWF's website:</p>

<blockquote cite="http://www.worldwildlife.org/who/index.html">
For 50 years, WWF has been protecting the future of nature.
</blockquote>

Here is a quote from WWF's website:

For 50 years, WWF has been protecting the future of nature.

caption

<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$50</td>
</tr>
</table>

center

<p>This is some text.</p>
<center>This text will be center-aligned.</center>
<p>This is some text.</p>

This is some text.

This text will be center-aligned.

This is some text.

dir

<dir>
<li>html</li>
<li>xhtml</li>
<li>css</li>
</dir>

• html

• xhtml

• css

div

<p>This is some text.</p>

<div style="background-color:lightblue">
<h3>This is a heading in a div element</h3>
<p>This is some text in a div element.</p>
</div>

<p>This is some text.</p>

dl

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

figure

<p>The Pulpit Rock is a massive cliff 604 metres (1982 feet) above Lysefjorden, opposite the Kjerag plateau, in Forsand, Ryfylke, Norway.</p>

<figure>
<img src="img_pulpit.jpg" alt="The Pulpit Rock" width="304" height="228">

</figure>

The Pulpit Rock is a massive cliff 604 metres (1982 feet) above Lysefjorden, opposite the Kjerag plateau, in Forsand, Ryfylke, Norway.

figcaption

<figure>
<img src="img_pulpit.jpg" alt="The Pulpit Rock" width="304" height="228">

<figcaption>Fig.1 - Pulpit Rock, Norway.</figcaption>
</figure>

Fig.1 - Pulpit Rock, Norway

footer

<footer>
<p>Posted by: Hege Refsnes</p>
<p>Contact information: <a href="mailto:someone@example.com">someone@example.com</a>.</p>
</footer>

Posted by: Hege Refsnes

Contact information: someone@example.com.

h1

<h1>Text</h1>

Text

h2

<h2>Text</h2>

Text

h3

<h3>Text</h3>

Text

h4

<h4>Text</h4>

Text

h5

<h5>Text</h5>

Text

h6

<h6>Text</h6>

Text

header

<article>
<header>
<h1>Most important heading here</h1>
<h3>Less important heading here</h3>
<p>Some additional information here.</p>
</header>
<p>Lorem Ipsum dolor set amet....</p>
</article>

Most important heading here

Less important heading here

Some additional information here.

Lorem Ipsum dolor set amet....

hgroup

<hgroup>
<h1>Calculus I</h1>
<h2>Fundamentals</h2>
</hgroup>
<p>This course will start with a brief introduction about the limit of a function.</p>

Calculus I

Fundamentals

This course will start with a brief introduction about the limit of a function.

hr

<p>HTML is a language for describing web pages.</p>

<hr>

<p>CSS defines how to display HTML elements.</p>

HTML is a language for describing web pages.

CSS defines how to display HTML elements.

menu

<div style="background:yellow;border:1px solid #cccccc;padding: 10px;" contextmenu="mymenu">
<p>Right-click inside this box to see the context menu!</p>

<menu type="context" id="mymenu">
<menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png"></menuitem>
<menu label="Share on...">
<menuitem label="Twitter" icon="ico_twitter.png" onclick="window.open('//twitter.com/intent/tweet?text=' + window.location.href);"></menuitem>
<menuitem label="Facebook" icon="ico_facebook.png" onclick="window.open('//facebook.com/sharer/sharer.php?u=' + window.location.href);"></menuitem>
</menu>
</menu>

</div>

<p>This example currently only works in Firefox!</p>

nav

<nav>
<a href="/html/">HTML</a> |
<a href="/css/">CSS</a> |
<a href="/js/">JavaScript</a> |
<a href="/jquery/">jQuery</a>
</nav>

HTML | CSS | JavaScript | jQuery

ol

<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>

<ol start="50">
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>

pre

<pre>
Text in a pre element
is displayed in a fixed-width
font, and it preserves
both spaces and
line breaks
</pre>

^{Text in a pre element is displayed in a fixed-width font, and it preserves both spaces and line breaks}

script

<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>

Hello JavaScript!

section

<section>
<h1>WWF</h1>
<p>WWF was founded in 1961.</p>
</section>

WWF

WWF was founded in 1961.

table

<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$50</td>
</tr>
</table>

ul and li

<ul>Text</ul>

<li>Text1</li>

• Text

  • Text