0% found this document useful (0 votes)
83 views

HTML Tables: Quick Links

HTML tables allow the user to create sections of web sites neatly divided, such as the page you are viewing now. Tables also allow you to divide up into columns almost like a spreadsheet, allowing you to organize your data better or to display a chart online.

Uploaded by

jgfaz
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
83 views

HTML Tables: Quick Links

HTML tables allow the user to create sections of web sites neatly divided, such as the page you are viewing now. Tables also allow you to divide up into columns almost like a spreadsheet, allowing you to organize your data better or to display a chart online.

Uploaded by

jgfaz
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 16

Copyright 1998-2007 by Computer Hope (tm).

All rights reserved Legal Disclaimer - ESD Warning - Privacy Statement

HTML tables
Quick links Basics Examples Questions and Answers HTML Help Basics Tables allow the user to create sections of web sites neatly divided, such as the page you are viewing now, we have one section (the blue section) to the right which allows you to navigate by using the side of the screen while still viewing the page. This also allows you to divide up into columns almost like a spreadsheet, allowing you to have columns and rows to organize your data better or to display a chart online (such as below examples). HITS MONTH TOTAL INCREASE 324,497 January 1998 436,699 February 1998 112,172

The above chart was done with the below source code. <table border="1"> <tr> <td><strong>HITS </strong></td> <td><strong>MONTH</strong></td> <td><strong>TOTAL INCREASE</strong></td> </tr> <tr> <td>324,497</td> <td>January 1998 </td> <td align="center">-</td> </tr> <tr> <td>436,699</td> <td>February 1998 </td> <td align="center">112,172</td> </tr> </table>

What does it all mean? <table border ="1"> This statement is telling how wide you wish the border to be. "0" would be no border. <tr> This is the statement to start the first row. <td><strong>HITS</strong></td> The <td> statement is to start the first column and </td> is to end the first column; the strong statement is making the text bold. The same applies for the next two lines. </tr> This statement is telling to end the first row. The next three lines are similar to what was explained above. <td align="center">-</td> This is similar to the 2nd line; however, the align="center" is the statement to tell it to center the text in the middle of the cell. The next six lines are similar to what was explained above. </table> This statement is to end the table without transforming the remainder of the document into the table. Examples Example Example Example Example Example Example 1 1 2 3 4 5 6 7 8 9 <table border="0" cellpadding="6" cellspacing="0"> <tr> <td bgcolor="#FFFF00">1 </td> <td bgcolor="#00FF00">2 </td> <td bgcolor="#00FFFF">3 </td> </tr> <tr> <td bgcolor="#FF00FF">4 </td> <td bgcolor="#FF0000">5 </td> <td bgcolor="#0000FF">6 </td> </tr> <tr> 1 2 3 4 5

<td bgcolor="#008080">7 </td> <td bgcolor="#FFFF00">8 </td> <td bgcolor="#00FFFF">9 </td> </tr> </table> <table border="0" cellpadding="6" cellspacing="0"> In this statement it is first telling the browser that it does not want a border by declaring border="0", also it is declaring that it wants the cells to have a little space by declaring cellpadding="6" this would make the cells bigger than they normally would be. Cellspacing="0" is telling the browser to display space between the cells. If this was 1 you would see white in between the cells; the bigger the number the more space there would be. <td bgcolor="#FFFF00">1 </td> Td is declaring a new cell, as explained in basics. The bgcolor="#FFFF00" is telling the browser what color to display the cell as; in this case, #FFFF00 would be yellow; you also could just write in yellow. For more on colors, view our color page. Example 2

The above image is actually three different images put in a table that is at 100% of the section of the screen. Below is the source code used for the above example. <table border="0" width="100%"> <tr> <td><img src="http://www.computerhope.com/ccguy.gif"></td> <td><p align="center"><img src="http://www.computerhope.com/title.gif"></p> </td> <td align="right"><img src="http://www.computerhope.com/ccguy.gif"></td> </tr> </table> <table border="0" width="100%"> The most important part of the above is the first line with the statement width="100%". This is telling the browser that the table needs to be 100% of the open screen (please take into consideration on

the above example it is 100% of the table currently in) this is good for the fact that even if someone displays your page in a bigger/smaller resolution or screen, it will automatically adjust to the full amount of the viewer's screen. Example 3 Welcome to Computer Hope, one of the most advanced free web sites on the Internet, helping you with all your computer related issues. Helping you with such topics as HTML, where we give examples, source code, enhancements, tips, and much more. Helping you with hardware questions with hundreds of technical pages of useful information with such hardware as printers, scanners, sound cards, modems, CD-ROM, zip drive, and much more. Helping you with software questions with such applications as DOS, Windows 95, Windows 3.x, Unix, Plus Pack, Adobe Photoshop, and more. Helping you with games, providing cheats for tons of games, complete walkthroughs, providing step by step instructions on conquering your favorite game, game news, and a lot more. Over 6,000+ pages of free, frequently updated information at your fingertips and all thanks to Computer Hope. This question is asked frequently where someone wants to post images and text right next to each other, to have the appearance of a news paper; the below source code shows how we did the above. We condensed our statement to make it look less intimidating. <table border="0"> <tr> <td><img src="chguy.gif"></td> <td valign="top">STATEMENT SHOWN ABOVE </td> </tr> </table> <td valign="top">STATEMENT SHOWN ABOVE </td> The most important line of the source code, valign="top", tells the browser to align the starting of the text at the top of the image, this can also be middle, bottom, right, left, or center. Example 4 Computer Hope <table border="10"> <tr>

<td><a href="http://www.computerhope.com">Computer Hope</a></td> </tr> </table> <table border="10"> This button effect is very simple by just making border="10" this makes the border 10 width, giving it the appearance of a button, which you could link to another page just as we did above. Example 5 WEB PAGE DESCRIPTION HITS MONTH Computer Hope Main page linking to all pages 3912 Feb 98 Cool Tricks HTML cool tricks 2514 Feb 98 <table border="0"> <tr> <td bgcolor="#0000FF"><font color="#FFFFFF"><strong>WEB PAGE</strong></font></td> <td bgcolor="#0000FF"><font color="#FFFFFF"><strong>DESCRIPTION</strong></font></td> <td bgcolor="#0000FF"><font color="#FFFFFF"><strong>HITS</strong></font></td> <td bgcolor="#0000FF"><font color="#FFFFFF"><strong>MONTH</strong></font></td> </tr> <tr> <td bgcolor="#00FFFF"><a href="http://www.computerhope.com">ComputerHope</a></td> <td bgcolor="#00FFFF">Main page linking to all pages</td> <td bgcolor="#00FFFF"><strong>3912</strong></td> <td bgcolor="#00FFFF">Feb 98</td> </tr> <tr> <td bgcolor="#00FFFF"><a href="http://www.computerhope.com/cooltrik.htm">Cool Tricks</a></td> <td bgcolor="#00FFFF">HTML cool tricks</td> <td bgcolor="#00FFFF"><strong>2514</strong></td> <td bgcolor="#00FFFF">Feb 98</td> </tr> </table>

Home - Computer help - Contact - Dictionary - Links Link to Computer Hope - Bookmark Computer Hope

Copyright 1998-2007 by Computer Hope (tm). All rights reserved Legal Disclaimer - ESD Warning - Privacy Statement

HTML, JavaScript's and picture tricks


Quick links JavaScript HTML JavaScript Celsius into Fahrenheit Time and date Make people stay JavaScript bookmark Letter by Letter scroll Date count down Make a new small window of another web page Button to refresh your page Send viewer back to page they came from Change background color depending on the time of day Random color every 5 seconds Random color that can be stopped Flashing colors when opening page Allow visitors to see history of visiting your page Random quotes Message displayed by time of day Message on status bar Random images and links Onmouse over Creating a Password on your page Disable mouse right-click HTML Index

Catego

HTML He

Compa
None

Relate Pages:

Resolv

Were y able to locate answer your questio


Mouse over prompt User chooses background color Your own prompt Mouse over prompt This allows you to prompt the person when their mouse is over a particular link or picture; great for letting someone know what a picture is, if the image is small. Source: <CENTER><TABLE WIDTH="40%"><TR><TD><A HREF="" ONMOUSEOVER = "alert('Welcome to ComputerHope')")> <IMG SRC="title.gif" BORDER="0" WIDTH="134" HEIGHT="64"></A></TD> <TD ALIGN=RIGHT><A HREF="" ONMOUSEOVER = "alert('Produced by Computer Hope')")> Who is responsible?</A></TD></TR></TABLE></CENTER> What it looks like: Who is responsible? User chooses background color Allow your users to choose their background color using JavaScript by adding the below code to your page. Click here to view demo. SOURCE: <center> <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" <a href="" onmouseover="document.bgColor='turquoise'">C</a> onmouseover="document.bgColor='pink'">h</a> onmouseover="document.bgColor='blue'">o</a> onmouseover="document.bgColor='red'">o</a> onmouseover="document.bgColor='yellow'">s</a> onmouseover="document.bgColor='green'">e</a> onmouseover="document.bgColor='white'">your</a> onmouseover="document.bgColor='greem'">o</a> onmouseover="document.bgColor='seagreen'">w</a> onmouseover="document.bgColor='magenta'">n</a> onmouseover="document.bgColor='fusia'">b</a> onmouseover="document.bgColor='purple'">a</a>

<a href="" onmouseover="document.bgColor='navy'">c</a> <a href="" onmouseover="document.bgColor='royalblue'">k</a> <a href="" onmouseover="document.bgColor='Skyblue'">g</a> <a href="" onmouseover="document.bgColor='brown'">r</a> <a href="" onmouseover="document.bgColor='almond'">o</a> <a href="" onmouseover="document.bgColor='coral'">u</a> <a href="" onmouseover="document.bgColor='olivedrab'">n</a> <a href="" onmouseover="document.bgColor='teal'">d</a> <a href="" onmouseover="document.bgColor='black'">color!</a></h2> </center> Another Choose your background Instead of using links this example uses a forum drop down menu that allows the user to select their background color. The source code for this example is shown below. Click here to view demo page. <form>Change the background color: <select name="backGround" size="1" onChange=(document.bgColor=backGround.options[backGround.selectedIndex].value)> <option value="000000">[Black] <option value="730200">[Dark Red] <option value="231800">[Brown] <option value="044302">[Dark Green] <option value="0D09A3">[Dark Blue] <option value="444444">[Gray] <option value="FF0400">[Red] <option value="EFE800">[Yellow] <option value="05EF00">[Green] <option value="0206FF">[Blue] <option value="AE08EF">[Violet] <option value="FF8C8A">[Mauve] <option value="FFCCCC">[Peach] <option value="FFCC99">[Orange] <option value="D5CCBB">[Tan] <option value="DDDDDD">[Light Gray] <option value="FBFF73">[Light Yellow] <option value="7CFF7D">[Light Green] <option value="A6BEFF">[Light Blue] <option value="FFFFFF" selected>[White] </select></form> Your own prompt This allows the person viewing your page to prompt themselves. We really couldn't

think of anything that this could be used for except for the person to talk to themselves; however, kind of cool. Source: <CENTER><FORM> <TEXTAREA NAME="text" ROWS="3" COLS="30"></TEXTAREA><p> <INPUT TYPE="button" VALUE="Say it!" onClick="alert(this.form.text.value)"> <INPUT TYPE="reset" NAME="cancel" VALUE="Clear Prompt"> </FORM></CENTER><P> What it looks like:

Clear Prompt

Batch Commands
This chapter is a complete reference for the commands supplied with MS-DOS 6. It includes an explanation of command syntax, a description of each command, and notes and examples. This chapter is a printed version of the online Help available in MS-DOS 6. To view the command reference online, type help followed by the command name at the command prompt. To see the Help table of contents, type help with no parameters. For a list of MS-DOS commands, type fasthelp at the command prompt.

A batch file or batch program is an unformatted text file that contains one or more MS-DOS commands and is assigned a .BAT extension. When you type the name of the batch program at the command prompt, the commands are carried out as a group. Any MS-DOS command you use at the

command prompt can also be put in a batch program. In addition, the following MS-DOS commands are specially designed for batch programs:
call choice echo for goto if pause rem shift

CONFIG.SYS Commands
The CONFIG.SYS file is a text file that contains special commands. These commands configure your computer's hardware components so that MS-DOS and applications can use them. When MS-DOS starts, it carries out the commands in the CONFIG.SYS file. Typically, the CONFIG.SYS file is located in the root directory of drive C. The following CONFIG.SYS commands can be used only in the CONFIG.SYS file:
buffers country device devicehigh dos drivparm fcbs files install lastdrive numlock shell stacks switches

The following commands are commonly used in the CONFIG.SYS file and can also be typed at the command prompt:
break rem set

The following special CONFIG.SYS commands are used only to define multiple configurations within the CONFIG.SYS file:

include menucolor menudefault

menuitem submenu

For more information about defining multiple configurations, see Commands for Defining Multiple Configurations. The CONFIG.SYS file can also contain the following special characters:
; Specifies that the current line is a descriptive comment and should not be carried out. Insert this character at the beginning of the line. (You can also insert a comment by using the rem command.) ? Specifies that MS-DOS is to ask for confirmation before carrying out the current command. Insert this character just before the equal sign (=). For example, to have MSDOS ask for confirmation before carrying out the dos=high command, you would change the command to read dos?=high.

Bypassing CONFIG.SYS and AUTOEXEC.BAT Commands


If you are having system problems that you suspect are caused by one or more commands in your CONFIG.SYS file, you might want to bypass some or all of the commands in your CONFIG.SYS file. To bypass all the commands in your CONFIG.SYS and AUTOEXEC.BAT files, press the F5 key immediately after starting your computer, when you see the text "Now starting MS-DOS...". To bypass individual CONFIG.SYS commands, press the F8 key instead. MS-DOS will then prompt you to carry out or bypass each CONFIG.SYS command. To carry out all remaining startup commands, press F5. To

bypass all remaining startup commands, press ESC. To disable this feature, add the switches /n command to your CONFIG.SYS file. For more information about your CONFIG.SYS file, see the chapter "Configuring Your System" in the MS-DOS 6 User's Guide.
Top of page

Device Drivers
The following installable device drivers are provided with MS-DOS:
ANSI.SYS CHKSTATE.SYS DBLSPACE.SYS DISPLAY.SYS DRIVER.SYS EGA.SYS EMM386.EXE HIMEM.SYS INTERLNK.EXE POWER.EXE RAMDRIVE.SYS SETVER.EXE SMARTDRV.EXE

The files COUNTRY.SYS and KEYBOARD.SYS are not device drivers. They are data files for the country and keyb commands, respectively. Do not try to load either of these files with the device command. If you do, your system halts, and you cannot restart MS-DOS. For information about loading COUNTRY.SYS, see the country command. For information about loading KEYBOARD.SYS, see the keyb command.
Top of page

International Commands
The following commands are useful when changing country-specific settings and character

sets (code pages):


chcp country keyb
Top of page

mode nlsfunc

Commands for Defining Multiple Configurations


A single CONFIG.SYS file can define several different system configurations. To define multiple configurations, you use the following special CONFIG.SYS commands:
include menucolor menudefault menuitem submenu

To define multiple configurations, follow these general steps: 1. Define a startup menu in the CONFIG.SYS file by using a [menu] header followed by one or more menuitem commands. The menudefault, menucolor and submenu commands can be used to define special characteristics of the startup menu. 2. Create a configuration block in the CONFIG.SYS file for each configuration you want. A configuration block begins with a block header a name surrounded by square brackets. To each block, add the CONFIG.SYS commands that you want MS-DOS to carry out when that configuration is selected from the startup menu. 3. (Optional) In the AUTOEXEC.BAT file, use batch commands such as goto and if to have MS-DOS carry out different AUTOEXEC.BAT commands depending on the startup configuration.

When a configuration is selected from the startup menu, MS-DOS defines an environment variable named CONFIG and sets it to the name of the selected configuration block. To have MSDOS carry out different sets of commands for different CONFIG values, add a goto %config % command to your AUTOEXEC.BAT file. For more information about defining multiple configurations, see the chapter "Configuring Your System" in the MS-DOS 6 User's Guide.

Defining Multiple Configurations in Your CONFIG.SYS File


The following CONFIG.SYS file defines two configurations:
[Menu] menuitem=Steve menuitem=Lisa [Common] dos=high buffers=15 device=c:\dos\himem.sys [Steve] files=20 device=c:dos\emm386 2048 [Lisa] files=40 device=c:\net\network.sys [Common]

This CONFIG.SYS file configures the computer for either Steve or Lisa. For both configurations, MS-DOS carries out the three commands in the first [common] section: dos=high, buffers=15, and device=c:\dos\himem.sys. Steve uses a

desktop publishing program that requires expanded memory, so his configuration includes a command for EMM386. He does not use the network. Lisa uses the network but not desktop publishing. Her configuration starts the network driver.

Defining Multiple Configurations in Your AUTOEXEC.BAT File


When a configuration is selected from the startup menu, MS-DOS defines an environment variable named CONFIG and sets it to the name of the selected configuration block. In the AUTOEXEC.BAT file, you can use the goto command to have MS-DOS carry out different sets of commands for different CONFIG values. The following AUTOEXEC.BAT file uses the goto command with the CONFIG variable to carry out different sets of commands. This AUTOEXEC.BAT file is designed to work with the sample CONFIG.SYS file in the preceding section.
c:\dos\smartdrv.exe set temp=c:\temp c:\dos\msav ; Go to the section that matches the current ; value of the CONFIG variable goto %config% :Steve path=c:\dos;c:\deskpub;c:\typeset c:\mouse\mouse.com deskpub` ; now skip Lisa's section & go to end goto end :Lisa

path=c:\dos;c:\network;c:\utility doskey net logon lisa goto end :end

When MS-DOS runs this AUTOEXEC.BAT file, it starts SmartDrive, sets the TEMP environment variable, and starts the MS-DOS Anti-Virus program. MS-DOS then goes to the section that matches the value of the CONFIG variable. If the name of the selected configuration is "Steve," MS-DOS goes to the Steve section. It then sets the search path for Steve, loads the MOUSE.COM program from the C:\MOUSE directory, and runs the desktop publishing program. The goto end command instructs MSDOS to skip to the End section; this prevents the commands in the Lisa section from being carried out for Steve's configuration. If the current configuration is "Lisa," the search path is set differently, MS-DOS runs the Doskey program, and a Logon command instructs the network driver (loaded from the CONFIG.SYS file) to connect the computer to the network.
Top of page

You might also like