1,2,3 HTML MADE EASY

HTML List (Advanced)


A List of Advanced HTML for your note pad. Just copy paste the entire page onto your note pad :)
Then if you want to make a list then just do a search and type in "lists". If you would like to see what these codes do in more detail see HTML.


An Advanced HTML List

<HTML>
<HEAD>
<TITLE> </TITLE>
<META NAME="description" content=".">
<META NAME="keywords" content=".">
<META NAME="author" CONTENT="">
<META NAME="copyright" CONTENT="Copyright  1999">
<META NAME="expires" CONTENT="15 September 2000">
<BASE HREF="HTTP://ADDY HERE/">

<SCRIPT LANGUAGE="JavaScript">
</SCRIPT> 

<STYLE>
</STYLE> 

</HEAD> 


BODY TAGS:
Without picture background:
<BODY BGCOLOR="#000000" text="#000000" link="#000000" vlink="#000000" alink="#000000">

with picture background:
<BODY BGCOLOR="#000000" text="#000000" link="#000000" vlink="#000000" alink="#000000" background="nameof.gif">

with picture background fixed:
<BODY BGCOLOR="#000000" text="#000000" link="#000000" vlink="#000000" alink="#000000" background="nameof.gif" bgproperties="fixed">


A BASIC TITLE
<P>
<CENTER><h1><B><I> Largest</I></B></h1></CENTER>
<P>
<CENTER><h2><B><I> 2ond Largest</I></B></h2></CENTER>
<P>

To open a new window:
<a href="" target="new_window"></a>

TEXT
SIZE <h1>Largest</h1> to <h6>smallest</6>

<b>bold</b>
<STRONG></STRONG> 
<BIG></BIG>
<i> italic</i>
<blink>Netscape only</blink>
<PRE>as typed</PRE>
<LISTING></LISTING>
<TT>type text</TT> 
<PLAINTEXT></PLAINTEXT>
<VAR></VAR>
<SMALL></SMALL>
<DFN>definition</DFN>
<ADDRESS></ADDRESS> 
<BLOCKQUOTE></BLOCKQUOTE>
<EM>Emphasis</EM> 
<KBD>Keyboard</KBD> 
<CITE></CITE>
<CODE></CODE>
<XMP></XMP> 
<SUB>DOWN</SUB>
<SUP>UP<SUP>   
<MULTICOL>Netscape</MULTICOL>
<SAMP></SAMP>  
<S>line through</S>
<DEL>line through</DEL>  
<U>underline</U>

<BR>break
<BR><BR><BR><BR>
<P>space
<P> </P>
space    words 
<NOBR>no break</NOBR>
<NOBR>stops<WBR>break</NOBR> 
<ul>indent</ul> 
<SPAN>Mouse over</SPAN> 
<CODE>invisible</CODE> 
<!-- invisible --> 



<P ALIGN="right"></P>
<P ALIGN="center"></P>
<P ALIGN="left"></P>

FONT TEXT:
<FONT FACE="Hancock"></FONT>

Or with Size
<FONT FACE="Bookman Old Style" SIZE=4></FONT>
<FONT SIZE="+1"></FONT> 

Or with color
<B><I><FONT FACE="Iglesia-Light" SIZE=6 COLOR="#000080"><P>Words here</P></B></I></FONT>
<BASEFONT COLOR="red"></BASEFONT> 
<FONT COLOR="red"></FONT>

LISTS:

Number lists
<OL>
<LI>
<LI>
<LI>
</OL>

Roman Numeral list
<OL TYPE="I">
<LI>
<LI>
<LI>
</OL>

Combined lists
<OL>
<LI>Main Heading
<UL>
<LI>
<LI>
</UL>
<LI>Secondary Heading
<UL>
<LI>
<LI>
</UL> 
</OL>

Definition list

<H4></H4>
<DL>
<DT>
<DD>
<DT>
<DD>
<DT>
<DD>
</DL>

Square Bullet list
<UL TYPE="square">
<LI>
<LI>
<LI>
</UL>

Round Bullets 
<UL>
<LI>
<LI>
<LI>
</UL>




LINES
<hr> 
<hr size =10 align=left noshade width=100%> 

GRAPHICS
<img src="" width= height= align="right,left, or center" alt="" border=0> 
<img src="" width= height= align=""  alt="" border=0>

Or 
<center><img src=""></center> 

Align Graphics and Text:

1 line of text
<ALIGN="top,middle,or bottom">
<FONT SIZE> </FONT>

Aligning Two Lines of Text
<BR CLEAR="all"> 

Framing Images
<TABLE BORDER="">
<TR>
<TD ALIGN="center"><IMG SRC=""></TD>
</TR>
</TABLE> 


LINKS
(using text as hyperlink)
<a href="http:// address">name of place</a> or <a href="index.html">name of index</a>

(using picture as link)
<a href="index.html"><img src="picture.gif" height=250 width=450 align=right(left, center) alt="Name of picture etc." border=0></a>

(using picture with text as link)
<img src="picture.jpg" height=250 width=450 align=right(left, center) alt="Name of picture etc." border=0><a href="index.html>HOME</a>

(link within your page)
<a href="#index">INDEX</a>  (where you want link to start)
<a name="index">  (where you want the link to go to)

Tables:
<TABLE>
<CAPTION></CAPTION>
<TABLE BORDER="" CELLSPACING="" CELLPADDING="">
<TABLE BGCOLOR=#000000 BORDER="" CELLSPACING="" CELLPADDING=""> 
(Reminder try BORDER COLOR?)

<TD BGCOLOR="#000000">
<FONT COLOR="#000000"></FONT> 
<TD BGCOLOR="#000000"><FONT COLOR="#ffffff"></FONT> 
<TD ALIGN="CENTER" COLSPAN=""
<TD ALIGN="CENTER" ROWSPAN="" 
WIDTH="#"
WIDTH="#%" 
<TR>

<TD></TD>
<TD ALIGN="CENTER"></TD>
<TD ALIGN="LEFT"><A HREF=""></A></TD>
<TD ALIGN="RIGHT"><IMG SRC=""></TD>

</TR> 
</TABLE>





FRAMES:
To break out of frames:
<A HREF="http://" TARGET="_top"></A>

<TITLE>First Frame Page</TITLE>
<FRAMESET COLS="%,%">
<NOFRAME> note to no frame users </NOFRAME> 
<FRAMESET ROWS="%,%">
<FRAME SRC="">
</FRAMESET>

FRAME SCROLLING="yes/no"
FRAME NORESIZE="yes/no"

Color frames:
<FRAMESET  ROWS="%,%"/COLS"%,%" BORDERCOLOR="000000">

Seamless Frames:
<FRAMESET COLS="%,%" FRAMEBORDER="0" FRAMESPACING="0" BORDER="0">

Linking Between frames:
<A HREF="http://" TARGET="">

FORMS:
<FORM METHOD="POST" ACTION="mailto:YOURMAIL@HERE">

TEXT box
<INPUT TYPE="text" NAME="topic here" SIZE="0">

Text area box
<TEXTAREA NAME="comments" ROWS=0 COLS=0></TEXTAREA>

Radio button
<INPUT TYPE="radio" NAME="TOPIC HERE" VALUE="button name">

Check Box
<INPUT TYPE="checkbox" NAME="TOPIC HERE" VALUE="button name">

Seclet box
<SELECT NAME="TOPIC HERE" SIZE="1">
<OPTION>
<OPTION>
<OPTION>
</SELECT>

<INPUT TYPE="submit"><INPUT TYPE="reset">

OR

<INPUT TYPE="submit" VALUE="Send Form" onClick="alert('Thank you so very much')";"><INPUT TYPE="reset">

</FORM> 


TO E-MAIL RIGHT FROM PAGE
E-Mail <A HREF="mailto:MAIL HERE">MAIL HERE</A>

TO E-MAIL USING PICTURE 
<A HREF="mailto:MAIL HERE"><img src="picture.gif" alt="" border=0></A>

SOUND

<EMBED SRC="" AUTOSTART=TRUE LOOP=TRUE WIDTH=145 HEIGHT=55 ALIGN="CENTER"><BGSOUND="">

<EMBED SRC="" AUTOSTART=FALSE LOOP=FALSE WIDTH=145 HEIGHT=55 ALIGN="CENTER"></EMBED>
If you do not it to show up, add the command HIDDEN="yes" or set the height and width to zero. 
AUTOSTART
"True" starts the file straight away, "false" prompts the viewer. 
LOOP 
"True" loops the sound so it plays forever. Make the loop "false" if you only want it played once. 

With a table
<P><center><TABLE BORDER=3 WIDTH=340><TD ALIGN=center><EMBED SRC="your.mid" AUTOSTART=FALSE LOOP=FALSE WIDTH=145 HEIGHT=55 ALIGN="CENTER">
</EMBED><BR><NOBR>Push play for Song Name</NOBR>
</TD></TABLE></center><BGSOUND="your.mid"><P>


<bgsound src="amarillo.mid" LOOP=infinite width=0 height=0 border=0><embed src="amarillo.mid" width="0" height="0" volume="100" autostart="true" align="bottom" border=0>

<embed src="tada.wav"autostart=true><bg sound="tada.wav"> 

<A HREF="passport.mid">listen to passport</A>


One will play with netscape the other without a midi player (Combined)

<HTML>
<HEAD>
<TITLE></TITLE>
<script language="JavaScript">
<!--
function playsong(songurl)

{popup=window.open (songurl, "Crescendo", "toolbar=no,location=bottom,directories=no,status=no,scrollbars=no,resizeable=no,copyhistory=no,width=200,height=25")}

//-->
</script>
<META NAME="description" content="The Bible for reading pleasure. With Pictures and music.">
<META NAME="keywords" content="nehemiah,bible,reading,music,pictures,chapters,books,old,new,testament,.">

</HEAD>
<BODY BGCOLOR>
(ULS go here if using>

<a href="javascript:playsong('dust_in.mid')">
<IMG SRC="tutormid.gif" ALT="Play Midi file" HEIGHT="30" WIDTH="60" align="left" BORDER="0"></a>

<p align="right"><embed src="dust_in.mid" autostart="false" loop="true" height=30 width=60
pluginspage="http://www.liveupdate.com/dl.html">
<bgsound="dust_in.mid" autostart="false" loop="true"></p>


SEPARATED:
(ONLY TO HAVE WITHOUT MIDI PLAYER)
<p align="right"><embed src="dust_in.mid" autostart="false" loop="true" height=30 width=60
pluginspage="http://www.liveupdate.com/dl.html">
<bgsound="dust_in.mid" autostart="false" loop="true"></p>


(WORKS WITH NETSCAPE)
<TITLE></TITLE>
<script language="JavaScript">
<!--
function playsong(songurl)

{popup=window.open (songurl, "Crescendo", "toolbar=no,location=bottom,directories=no,status=no,scrollbars=no,resizeable=no,copyhistory=no,width=200,height=25")}

//-->
</script>
<META NAME="description" content=".">
<META NAME="keywords" content=".">

</HEAD>

<BODY BGCOLOR>
(ULS go here if using)

<a href="javascript:playsong('dust_in.mid')">
<IMG SRC=".gif" ALT="Play Midi file" HEIGHT="30" WIDTH="60" align="left" BORDER="0"></a>





</BODY>
</HTML>


Designing Christian Web SitesHTML
Designing Christian Web SitesTables
Designing Christian Web SitesFrames
Designing Christian Web SitesForms
Designing Christian Web SitesGraphics
Designing Christian Web SitesMusicDesigning Christian Web Sites
Designing Christian Web SitesMain Page
Designing Christian Web SitesSite IndexDesigning Christian Web Sites