Sideway
output.to from Sideway



Draft for Information Only

Content

CSS Code and Pre Tags
 Equation Block
 Equation Inline Block
 Equation Example

CSS Code and Pre Tags

In general, a html <code> tag is used to define a block of inline computer code and a html <pre> tag is used to define a block of preformatted text block. Usually, a block of preformatted computer code is tagged by the nested html <pre><code> tag pair.

HTML Document Input:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
div {font-size:1em;line-height:1.2em}
code,pre {padding:3px; outline: silver solid 1px;}
pre>code {outline: cyan solid 1px;}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
This is <code>an
inline code
</code>
This is <pre>a
preformatted block
</pre>
This is <pre><code>a
preformatted
code block</code></pre>
</div>
    </body>
</html>
HTML Web Page Embedded Output:

not support

Equation Block

Since a computer code is usually rendered as a preformatted block, the html <code> tag can therefore be used to tag a block of equation by redefining the attribute of <code> tag.

HTML Document Input:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
div {font-size:1em;line-height:1.2em}
code, pre {display:block; padding:1px; outline: silver solid 1px;}
pre>code {outline: cyan solid 1px;}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
This is <code>a
code block
</code>
This is <pre>a
preformatted block
</pre>
This is <pre><code>a
preformatted block of
a code block</code>new text</pre>
</div>
    </body>
</html>
HTML Web Page Embedded Output:

not support

Equation Inline Block

Besides, the html <code> tag can also be used to tag an equation as an inline block by redefining the attribute of <code> tag.

HTML Document Input:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
div {font-size:1em;line-height:1.2em}
pre {display:block; padding:1px; outline: silver solid 1px;}
code {display:inline-block; padding:1px; outline: silver solid 1px;}
pre>code {outline: cyan solid 1px;}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
This is <code>an
inline code block
</code>
This is <pre>a
preformatted block
</pre>
This is <pre><code>a
preformatted block of
an inline code block</code>new text</pre>
</div>
    </body>
</html>
HTML Web Page Embedded Output:

not support

Equation Example

Examples of an inline-block equation and an equation block

HTML Document Input:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
div {font-size:1em;line-height:1.2em;}
p {clear:both;}
code {display:block; width:90%; margin:0 auto; padding:1px; outline: silver solid 1px;}
span {display:block;}
span>code {float:left; width:90%; margin:0 3%; outline: blue solid 1px;}
p>code {display:inline-block; width:auto; outline: cyan solid 1px;}
</style>
<title>Sample Page</title>
    </head>
    <body>
<div>
This is <code>a
code block
</code> new text
<div>This is <span><code>a
code block
</code>88</span></div>
<p>This is <code>an
inline code block</code> new text</p>
<p>This is <code style="width:50%">an
inline code block</code> new text</p>
<p>This is <code style="width:70%">an
inline code block</code> new text</p>
<p>This is <code style="width:90%">an
inline code block</code> new text</p>
<p>This is <code style="width:95%">an
inline code block</code> new text</p>
</div>
    </body>
</html>
HTML Web Page Embedded Output:

not support


©sideway
close

References

  1. http://www.w3.org/TR/1999/REC-html401-1999, 1999, HTML 4.01 Specification: W3C Recommendation, updated 24 December 1999
close

ID: 190300026 Last Updated: 2019/3/26 Revision: Ref:

IMAGE

Home (5)

Business

Management

HBR (3)

Information

Recreation

Hobbies (7)

Culture

Chinese (1097)

English (336)

Reference (66)

Computer

Hardware (149)

Software

Application (187)

Digitization (24)

Numeric (19)

Programming

Web (648)new

CSS (SC)

ASP.NET (SC)

Regular Expression (SC)

HTML

Knowledge Base

Common Color (SC)

Html Entity (Unicode) (SC)

Html 401 Special (SC)

OS (389)

MS Windows

Windows10 (SC)

.NET Framework (SC)

DeskTop (7)

Knowledge

Mathematics

Formulas (8)

Number Theory (206)

Algebra (20)

Trigonometry (18)

Geometry (18)

Calculus (67)

Complex Analysis (21)

Engineering

Tables (8)

Mechanical

Mechanics (1)

Rigid Bodies

Statics (92)

Dynamics (37)

Fluid (5)

Fluid Kinematics (5)

Control

Process Control (1)

Acoustics (19)

FiniteElement (2)

Biology (1)

Geography (1)


Copyright © 2000-2019 Sideway . All rights reserved Disclaimers last modified on 10 Feb 2019