M O N D O  F U E G O ' S  H T M L  P R A C T I C E  B O A R D

This is a limited-access board where members of Mondo Fuego's Civilized Personal Discussion Board [http://disc.yourwebapps.com/Indices/227735.html] can practice HTML (Hyper Text Markup Language) code to enhance text, build tables, show pictures, provide links to other web pages, and embed music and/or video clips in posts. You can also use this board for technical discussions and questions. HTML code can be used only in the 'Message' section of a post, and cannot be used in the 'Author', 'Email' and 'Subject' fields on this board and on the Civilized Personal Discussion Board.

You can contact me at: MondoFuego@yahoo.com.

1. To post a picture ('.bmp', '.jpg', '.gif', etc.):

General format: <img src="URL">

Sample picture HTML: <img src="http://splinter59.canalblog.com/images/Ford_gt_405.jpg">
Note: URL (Uniform Resource Locator) = web address of a web site, picture, music cut, etc. Example: http://disc.yourwebapps.com/Indices/233789.html

2. To embed music or sound in a post ('.ram', '.ra', '.wmp', '.wma', '.mid', '.mp3', '.rmi', '.wav', etc.):

General formats:

1. <embed src="URL" autostart="true" loop="true" hidden="true"></embed>

... or ...

2. <bgsound src="URL" loop="1 ... 2 ... 3 ... etc.">

Sample music HTML: <embed src="http://www.hhdarma.addr.com/disco/df-06.rm" autostart="true" loop="true" hidden="true"></embed>
   To embed a video clip in a post ('.mpg', '.mpeg', '.wmv', etc.):

General format: <embed src="URL" width=(# pixels) height= (# pixels) autostart=(0 or 1) loop=(0 or 1) showcontrols=(0 or 1) volume=(# decibels)></embed>

Sample video HTML: <embed src="http://media.ebaumsworld.com/wmv/runoveraccident.wmv" width=320 height=285 autostart=1 showcontrols=1 volume=-20></embed>

3. To post a link to another web page:

General format: <a target="_blank" href="URL">Text describing link</a>

Sample link HTML: <a target="_blank" href="http://disc.yourwebapps.com/Indices/227735.html">Mondo's Board</a>
[Notes: (1) the link text "Mondo's Board" will appear underlined, indicating that it is a clickable link; (2) the 'target="_blank"' sub-command causes the linked web page to open in another window; if omitted, the linked web page will open in [on top of] the then-current window, and you will have to click the browser "Back" button to get back to the original page containing the link; (3) you can use the "embed" command with 'hidden="false"' to display a video, but it does not always work well - it is better to use a clickable link and have the video open in a new window.]

4. Text attribute commands:

Bold: <b>Text</b> - sample: Text

Underline: <u>Text</u> - sample: Text

Italics: <i>Text</i> - sample: Text

Strike-thru: <s>TEXT</s> - sample: TEXT

Subscript: H<sub>2</sub>O - sample: H2O

Superscript: πr<sup>2</sup> - sample: πr2

Multiple attributes: <b><u><i>Text</i></u></b> - sample: Text
[Note: apply attribute cancel commands (e.g., </b>) in inverse order that the attribute commands were used - i.e., use proper "nesting" of commands - it will help avoid confusion when you're trying to debug HTML.]

5. Font attribute commands:

Font size: <font size=5>Text</font> - sample: Text

Font color: <font color=red>Text</font> - sample: Text

Font face: <font face="Old English Text MT">Text</font> - sample: Text
Multiple font attributes: <font face=Playbill size=8 color=deeppink>Text</font> - sample: Text
[Notes: (1) refer to HTML color charts at MDSN HTML Reference Library for standard color names or use the hexadecimal 'rrggbb' codes at Visibone - e.g., "FF0000" = red, "00FF00" = green, "0000FF" = blue, "000000" = black, "FFFFFF" = white - there are 16,777,216 color combinations; (2) it appears that normal font size on the disc.yourwebapps.com boards is "3"; (3) the font face names can be found in Microsoft Word and numerous other places - if it is a single word {e.g., Playbill}, you don't need quotes - if it is multiple words {i.e., contains embedded spaces, e.g., "Old English Text MT"}, you need quotes; (4) you can scale the size of the font up and down with '+n' or '-n' (e.g., 'size=+2') without having to remember what the previous font size declaration was - then, the </font> command resets to the previous font size declaration.]

6. Table commands:

This basic table:
Row 1, Cell 1Row 1, Cell 2
Row 2, Cell 1Row 2, Cell 2
has the following HTML code:

<center><table width=250 border=3 cellpadding=3 cellspacing=5> <tr><td bgcolor=pink>Row 1, Cell 1</td><td bgcolor=lime>Row 1, Cell 2</td></tr> <tr><td bgcolor=teal>Row 2, Cell 1</td><td bgcolor=plum>Row 2, Cell 2</td></tr> </table></center>
Where: <center> ... </center> - centers table in field <table> ... </table> - defines table definition beginning & end width - width of table in # of pixels [optional] border - thickness of table border in # of pixels cellpadding - # of pixels between edges of table cells and cell contents cellspacing - # pixels forming border of each cell <tr> ... </tr> - defines beginning and end of a table row <td> ... </td> - defines beginning and end of a table cell or column bgcolor - background color of cell
[Note: there are numerous other sub-commands associated with tables which can be found in the reference materials provided in Section 8.]

7. Blockquote text frame commands:

This blockquote text frame has the following HTML code:

<blockquote style="background-color: turquoise; margin-left: 6; margin-right: 6; border-bottom: 10px ridge #00ff00; border-top: 10px ridge #ff00ff; border-left: 10px ridge #00ffff; border-right: 10px ridge #ffff00; padding: 2em 1em"></blockquote>
Where: <blockquote> ... </blockquote> - defines beginning and end of text frame style="..." - can contain the following text frame parameters: background-color: - background color inside frame margin-left: - left margin outside frame in mm margin-right: - right margin outside frame in mm border-bottom (-top) (-left) (right): - border width in pixels ('10px') - border style ('ridge') - border color ('#00ff00') padding: margin between inside frame wall and text in cm: - first parameter is top and bottom margin ('2em') - second parameter if left and right margin ('1em') width: - width in pixels ('600px')
[Note: there are other sub-commands associated with blockquote which can be found in the reference materials provided in Section 8.]

8. Additional HTML reference materials:

A. Microsoft MSDN Web Development Reference (note handy +/- index on left of page)
B. disc.yourwebapps.com HTML Tips & Tricks Cheat Sheet
C. HTML Dog
D. MSDN Color Chart
E. VisiBone Color Chart
F. HTML Reference Guide
G. Sizzling HTML Jalfrezi
H. Purpose & Placement of HTML Commands
I. WebMonkey
J. HTML Goodies
K. DRAAC.com HTML & Javascript Test Bed (HTML Test Site)
L. Mastering HTML 4 by Deborah & Eric Ray (this book is definitely worth buying)

9. School of "Hard Knocks":

After you have mastered the basics, you can advance your skills greatly by exploring the HTML code behind interesting web pages.

Just right-click on a web page and click 'View Source', which will bring up the web page code in ASCII-2 text format in Microsoft Notepad.

You can then browse the code or use 'Edit' ... 'Search' to find items of specific interest (e.g., 'table'). Some of the code strings will be long, and you will have to scroll horizontally to view everything. You can cut down the horizontal width of long strings by placing the cursor anywhere you like (hopefully at the intersection of a '><' pair) and pressing the 'Enter' key once - this will not cause a line break when the code is interpreted in a subsequent post or in a web browser or in a HTML code builder like Microsoft FrontPage (I forgot to mention that a line break is caused by the '<br>' command, and additional space characters are generated by the '&nbsp;' mnemonic representation or the '&#160;' numeric representation - [HTML Character Codes]).

You can cull out code that you don't want and edit the remaining code to suit your needs, and you can test the results along the way in a post on this board or with some other HTML test facility.

You can save the file as a '.txt' file for subsequent editing via Notepad or any other text editor. You can also save the file as a '.htm' file and do further editing in Microsoft FrontPage. And, you can click on your '.htm' file using Windows Explorer or Windows XP File Manager and see your code interpreted by your web browser (e.g., Microsoft Internet Explorer).

Not all web browsers will interpret sophisticated "bleeding edge" HTML code correctly, so if you are using a "dark horse" browser and you see some inexplicable strange results, you may need to update your web browser to the latest version, or switch to a different browser, or tone-down the sophistication of your HTML code to a lower common denominator.

As you are posting test HTML code here, it would be helpful to yourself and others if you put a short description of what you are doing in the 'Subject' field. Also, after you have entered your code in the 'Message' field, copy it and paste it a second time below your original code and surround it with <xmp> ... </xmp> ('example') commands so that you can see what code you entered as well as see the results.

Last, but not least, you can post questions here on this board in the 'Subject' field, and with any luck a Good Samaritan will assist you; it might help to leave an e-mail address for someone to respond to you.

~ sumcogito ~

Lease this WebApp and get rid of the ads.

test ~ Me, Sat Sep 17 17:33



test ~ Anonymous, Sun May 1 23:19
    • test ~ Anonymous, Sat May 7 22:14
      • test ~ Anonymous, Sat May 7 22:19
        • test ~ Anonymous, Sun May 8 15:32
          • test ~ Anonymous, Sat May 28 00:12
            • test ~ Anonymous, Tue Jun 14 05:30
              • test ~ Anonymous, Mon Jun 20 19:03
                • test ~ me, Sat Sep 17 17:35



  • test ~ Anonymous, Tue Oct 20 11:18
    • Testing ~ Anonymous, Sun Nov 1 14:00
      • test ~ Anonymous, Tue Dec 8 12:26
        • Baltic ~ Anonymous, Wed Dec 23 11:08



  • Takes A Village ~ Anonymous, Thu May 21, 2015 10:58
    • test ~ Anonymous, Thu May 21 22:51



  • test ~ Anonymous, Tue Apr 14, 2015 16:52
    • test ~ Anonymous, Tue Apr 14 16:55
      • test ~ Anonymous, Fri May 1 19:35
        • test ~ Anonymous, Thu Jun 4 00:25
          • rest ~ Anonymous, Wed Jul 22 07:36
            • rest 2 ~ Anonymous, Wed Jul 22 12:20



  • Thank You ! ~ Anonymous, Tue Mar 10, 2015 08:46
    • test ~ Anonymous, Wed Apr 1 23:47
      • test ~ Anonymous, Fri Apr 3 07:22
        • Testing ~ Anonymous, Wed Apr 29 12:33



  • test ~ Anonymous, Fri Feb 13, 2015 14:37
    • test ~ Anonymous, Fri Feb 13 15:05
      • test ~ Anonymous, Fri Feb 13 15:07
        • test ~ Anonymous, Wed Feb 18 08:17
          • test ~ Anonymous, Mon Mar 2 23:13
            • test ~ Anonymous, Mon Mar 9 15:27
              • test ~ Anonymous, Sat Mar 14 10:18
                • test ~ Anonymous, Wed Sep 2 23:02



  • hm ~ hm, Mon Nov 10, 2014 15:01



  • test ~ Anonymous, Fri Aug 29, 2014 09:37
    • test ~ Anonymous, Sat Aug 30 00:25
      • test ~ Anonymous, Sat Oct 11 10:26
        • test ~ Anonymous, Sat Oct 11 10:27
          • test ~ Anonymous, Wed Nov 5 14:36
            • test ~ Anonymous, Wed Nov 5 14:37
              • Testing ~ Anonymous, Wed Nov 19 11:36
                • test ~ Anonymous, Tue Jan 27 20:35



  • test ~ Anonymous, Mon Jul 7, 2014 22:59
    • test ~ Anonymous, Thu Jul 10 22:20
      • test ~ Anonymous, Fri Jul 11 09:03
        • test ~ Anonymous, Wed Jul 23 09:50



  • Practice post ~ Billy Joe Bob, Sat Mar 22, 2014 09:51
    • test ~ Anonymous, Thu Apr 24 13:24
      • test ~ Anonymous, Thu Apr 24 13:25
        • test ~ Anonymous, Sat Apr 26 12:54
          • test ~ Anonymous, Fri Jun 13 08:15



  • s ~ s, Tue Mar 11, 2014 12:35
    • t ~ t, Tue Mar 11 12:47
      • u ~ u, Tue Mar 11 13:01
        • v ~ v, Tue Mar 11 13:15
          • Re: v ~ Anonymous, Wed Mar 12 13:53
            • test ~ Anonymous, Thu Apr 24 10:48
              • test ~ Anonymous, Mon May 19 12:56
                • test ~ Anonymous, Wed Jun 11 07:05



  • No Subject ~ Anonymous, Fri Sep 13, 2013 18:54
    • test ~ Anonymous, Sat Nov 30 13:14
      • Re: test ~ Anonymous, Sat Dec 28 00:10
      • test ~ Anonymous, Sat Dec 28 00:09



  • Bike tests ~ Ken, Tue Jul 2, 2013 17:54



  • This is a damn nice training facility ~ Mondo Fuego™, Fri May 3, 2013 01:27
    • Test ~ Mondo Fuego™, Fri May 3 01:27
      • Re: Test ~ Anonymous, Sat Jul 27 23:16
        • test ~ Anonymous, Fri Aug 23 16:30
          • test ~ Anonymous, Fri Aug 23 17:11
            • test ~ Anonymous, Fri Aug 23 23:59



  • ok .. practice.. ~ scott, Tue Feb 21, 2012 22:26



  • Lieutenant ~ Mondo Fuego, Wed Jul 28, 2010 11:04
    • Merci ~ ♫Just_ Me ♥, Thu Jan 13 08:13
      • Again ~ Mondo Fuego™, Mon Apr 4 08:20
    • Un autre fois ~ Mondo Fuego™, Mon Dec 13 20:03
      • Test ~ Anonymous, Sat Nov 17 12:06
        • Test 2 ~ Anonymous, Sat Nov 17 12:08



  • Test Test Test One, Two, Tree!! ~ Jeffersonne, Fri Mar 5, 2010 21:07
    • testz ~ gene, Sun May 23 10:05
      • testa ~ testa, Sun May 23 10:24
        • a ~ a, Sun May 23 17:46
        • testb ~ testb, Sun May 23 10:31
          • teste ~ teste, Sun May 23 11:01
            • t ~ t, Sun May 23 11:32
          • testd ~ gene, Sun May 23 10:49
      • testy ~ gene, Sun May 23 10:09



  • No Subject ~ test, Sat Feb 6, 2010 09:42



  • none ~ Boogieman, Fri Feb 5, 2010 09:07
    • Re: none ~ Anonymous, Fri Feb 5 12:19
    • 2nd try ~ Hootman, Fri Feb 5 10:15
      • q ~ q, Sun May 23 18:18
        • r ~ r, Sun May 23 18:19



  • No Subject ~ Anonymous, Mon Dec 14, 2009 15:25
    • Lieutenant ~ Mondo Fuego, Sat Jan 23 01:28
      • test ~ Anonymous, Mon Dec 22 17:15



  • No Subject ~ Anonymous, Mon Sep 28, 2009 20:40



    So who's got the best looking Disc App? ~ Brent, Sat Jun 13, 2009 11:51



    wert ~ darf, Sun Apr 19, 2009 14:49
    • sdlkfj ~ fgh, Thu May 28 12:15
      • ytthju ~ hgjhgj, Thu Jun 25 13:44



  • dsv ~ sdf, Sun Apr 19, 2009 13:59



    Vidi ~ Vici ~ Veni