Some Coding Examples

This is how you would create a paragraph. Any extra spaces you insert anywhere, e.g., to try to do indenting, are lost. Such formatting is handled in another part of the document (the CSS style section). Similarly, don't worry about where one line stops and the next begins, i.e., line breaks, since all the text will be flowed as required by the formatting specified in the CSS section.

Here is the next paragraph, followed by an ordered list.

  1. This text would appear as item 1 in the list.
  2. This would appear as item 2 in the list.
  3. This would appear as item 3 in the list. It might be a very long item; the text would just be automatically flowed by the brower as specified by the CSS formatting.

Here is an unordered list.

Indenting in the source text is not relevant, although I usually indent (as in the ordered list example) to make it easy to read as I develop the text. However the browser doesn't care; it is perfectly happy with messed up indenting (as in the unordered list example) and does the proper indenting, as specified in the style section of the document.

Here are various ways to emphasize text: some bold text, some italicized text, and some underlined text. You can also combine these, e.g., here is bold underlined italicized text. Just make sure they are properly nested, which is important for all tags.

In some rare cases you may want to tell the browser to force a line break, e.g., in contact information:

Joe Schultz
12234 Willow Street
New York, NY
212-555-6789

Finally, just to show you how special formatting can be applied to any text, this paragraph shows how the CSS style section can be used to do that work. The "class" parameter with a value of "warnnote" tells the browser to look for p.warnnote in the style section and apply the formatting listed there, which is very flexible -- there are many, many things that can be specified to produce just about any appearance you might want.


<!DOCTYPE html>
<!-- *** MM_CODING_EXAMPLES HTM - 26 May 2024  16:20:18 - JGKNAUTH -->

<html lang="en-us">
<head>
   <title>Some Coding Examples</title>
   <style>
      body {font-size: 16px; font-family: arial, helvetica, serif; width: 40em; margin: 1em auto;}
      p.warnnote {color: brown; background: yellow; border: 2px solid black;}
      p.warnnote {padding: .2em .5em; margin: 1.1em auto; width: 40em; font-weight: 700;}
      ol, ul {margin: -.5em auto 1em;}
   </style>
</head>

<body>

<h1>Some Coding Examples</h1>

<p>This is how you would create a paragraph.  Any extra spaces you
insert anywhere, e.g., to try to do indenting, are lost.
       Such formatting is
handled in another part of the document (the CSS style section).
Similarly, don't worry about where one line stops and the next begins,
i.e., line breaks, since all the text will be flowed as required by the
formatting specified in the CSS section.</p>

<p>Here is the next paragraph, followed by an ordered list.</p>

<ol>
   <li>This text would appear as item 1 in the list.</li>
   <li>This would appear as item 2 in the list.</li>
   <li>This would appear as item 3 in the list. It might be a very long
       item; the text would just be automatically flowed by the brower
       as specified by the CSS formatting.</li>
</ol>

<p>Here is an unordered list.</p>

<ul>
   <li>This text would appear as the first bullet in the list.</li>
<li>This would appear as the second bullet in the list.</li>
   <li>This would appear as the third bullet in the list. It might be a
very long
       item; the text would just be automatically flowed by the browser
   as specified by the CSS formatting.</li>
</ul>

<p>Indenting in the source text is not relevant, although I usually
indent (as in the ordered list example) to make it easy to read as I
develop the text.  However the browser doesn't care; it is perfectly
happy with messed up indenting (as in the unordered list example) and
does the proper indenting, as specified in the style section of the
document.</p>

<p>Here are various ways to emphasize text: <b>some bold
text</b>, some <i>italicized text</i>, and <span
class="uline">some underlined text</span>.  You can also
combine these, e.g., <span class="fullemp">here is bold underlined
italicized text</span>.  Just make sure they are properly nested,
which is important for all tags.</p>

<p>In some rare cases you may want to tell the browser to force a line
break, e.g., in contact information:

<br />
<br />
Joe Schultz<br />
12234 Willow Street<br />
New York, NY<br />
212-555-6789
</p>

<p class="warnnote">Finally, just to show you how special formatting can
be applied to any text, this paragraph shows how the CSS style section
can be used to do that work.  The "class" parameter with a value of
"warnnote" tells the browser to look for p.warnnote in the style section
and apply the formatting listed there, which is very flexible -- there
are many, many things that can be specified to produce just about any
appearance you might want.</p>

</body>
</html>