Add to Google

Basic HTML Tutorial
Pages: 1, 2
free web hosting

Read Latest Entries..: (Post #17) by Crazy Photon on Feb 22 2005, 04:47 PM. (Line Breaks Removed)
Unordered lists: CODE<ul>    <li>Element    <li>Element    <li>Element</ul> Ordered lists: CODE<ol>    <li>Element    <li>Element    <li>Element</ol>
Read the FIRST post of this Topic. - Express your Opinion! Contribute Knowledge :-).

Open Discussion > Have your say > General Talk

Basic HTML Tutorial

Fatal-Fatality
Nov 7 2004, 09:04 PM
Here is some basic HTML... I will give an example doc first, and then break it down. Also, will give some extras that could make your page fun and interesting!

Example Doc:
CODE
<HTML>

<title>Page Title</title>

<BODY> <body bgcolor=background color><body text=Main Text>

<center><h1>Title Of Article</h1></center><br>

Text....

</BODY>

</HTML>



This will generate something like this:
Title Of Article(This Centered)
Text.....

Here are some basic tags:

Font Color:
CODE
<font color=color or hex>WORD OR SENTENCE(S)</font>

Font Size:
CODE
<font size=1-7>WORD OR SENTENCE(S)</font>

Font Color and Size:
CODE
<font color=color or hex><font size=1-7>WORD OR SENTENCE(S)</font></font>

Scrolling Text: (From Right to Left)
CODE
<marquee>WORD OR SENTENCE(S)</marquee>

Insert Image:
CODE
<img src="http://LINK.COM/DIR/IMAGEFILE.EXT">

Link:
CODE
<a href="http://LINK.COM/">LINK TEXT OR LINK AGAIN</a>

Image Link:
CODE
<a href="http://LINK.COM/"><img src="http://LINK.COM/DIR/IMAGEFILE.EXT"></a>

Audio Embed:
CODE
<embed src="http://LINK.COM/DIR/FILE.EXT" hidden="true/false" loop="true/false/# of times" autostart="true/false">

Video Embed:
CODE
<embed src="http://LINK.COM/DIR/FILE.EXT">

Crossout Text:
CODE
<strike>TEXT</strike>


A Template to edit:
CODE
<HTML>

<title>Page Title</title>

<BODY><body bgcolor=black><body text=red>

<center><h1>Page Template</h1</center><br>

<font color=blue><font size=4>Welcome, here is a template anyone can make, this was designed for <strike>dummies</strike> new Webmasters wanting to learn HTML!</font></font><font color=green> Have Fun, and Good Luck!</font><br><br>-Thanks<br><br>-Fatal-Fatality

</BODY>

</HTML>

If I forgot anything, let me know!

(sticky by whizz)

 

 

 


Reply

SSR
Nov 7 2004, 09:16 PM
That kindda helps with special effects on your html website, but i need html instaltion tutorials i ahvent found any yet that i know what their talking about. Every tutorial website gives genral stuff never step by step stuf they say do this and that, they dont tel you where to do it. but thanks for the tutorials they will help on my website i wil be sure to check back here when i get my site running i found alot of useful ones. thanks again.

edited: oh this is a poll? i voted yet even though i knew some of them, and knew how to like use al of them, but the way i kenw how to do it wasnt as fast as using these html scripts.

Reply

Meeko
Nov 7 2004, 09:17 PM
I know most of this stuff, but a few things helped me out, thanks man. biggrin.gif

If you don't mind, I'd like to contribute.


QUOTE
CODE
<font color=color or hex>WORD OR SENTENCE(S)</font>


You can find hex color codes here. http://www.december.com/html/spec/color.html

Reply

Fatal-Fatality
Nov 8 2004, 09:28 PM
No problem, like I said, if you can add anything, please do, and good luck in your further HTML, PHP, etc. scripting!

-Fatal-Fatality

Reply

Winbots
Nov 9 2004, 03:22 AM
ok, im going to approach this abit different. im going to give you a step by step tutorial on how to make a simple webpage:


first things first, every html tag is enclosed in

every tag must be closed before a parent tag is closed. ex:
CODE


<HTML><BODY></HTML></BODY>  (INCORRECT)


it should be:
CODE


<HTML><BODY></BODY></HTML>  (CORRECT)



every webpage should be enclosed in the HTML tag, so:
CODE


<HTML>



</HTML>



the invisible part of the webpage should be enclosed in the HEAD tag, the most common tag that goes inside the HEAD tag is the TITLE tag which is what is displayed in the browser bar, so:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

</HTML>



the part that you see should be enclosed in the BODY tag, and any text in the BODY tag will appear as text, so:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY>

This is my very cool web page!

</BODY>

</HTML>



BUT I WANT MY BACKGROUND TO BE BLACK!!!
well then you will do the following:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

This is my very cool web page!

</BODY>

</HTML>



GRR! NOW I CANT SEE MY TEXT!
your text is black too! smile.gif
Well I want it white...
ok, then add the FONT tag with the COLOR set to white smile.gif:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

<FONT COLOR="white">

This is my very cool web page!

</FONT>

</BODY>

</HTML>



ok that's better smile.gif
I want the text 'This is my very cool web page!' to be big like a header
then use a H# tag where # is the header number from 1 to 6, where 1 is biggest and 6 is smallest. like such:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

<FONT COLOR="white">

<H1>This is my very cool web page!</H1>

</FONT>

</BODY>

</HTML>



What about a line across the page?
use the HR tag, like:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

<FONT COLOR="white">

<H1>This is my very cool web page!</H1>

<HR>

</FONT>

</BODY>

</HTML>



now i want a link!
ok... use the A tag with HREF set to the link you want it to go to... like such:
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

<FONT COLOR="white">

<H1>This is my very cool web page!</H1>

<HR>

<A HREF="http://winbots.org/">my other very cool website!</A>

</FONT>

</BODY>

</HTML>



now i want a new line
use the BR tag where ever you want a newline (note hitting enter will NOT start a new line):
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

<FONT COLOR="white">

<H1>This is my very cool web page!</H1>

<HR>

<A HREF="http://winbots.org/">my other very cool website!</A><BR>

my other cool text..<BR>

and my other line...

</FONT>

</BODY>

</HTML>



now i want to do just one more thing... i want a link to my email
ok it works like a reguler link except instead of http://www.mydomain.com, you do mailto:myemail@mydomain.com.
CODE


<HTML>

<HEAD>

<TITLE>My Cool Web Page!</TITLE>

</HEAD>

<BODY BGCOLOR="black">

<FONT COLOR="white">

<H1>This is my very cool web page!</H1>

<HR>

<A HREF="http://winbots.org/">my other very cool website!</A><BR>

my other cool text..<BR>

and my other line...<BR><BR>

you can email me <A HREF="mailto:Cobi@winbots.org">here</A>

</FONT>

</BODY>

</HTML>

 

 

 


Reply

Nazrin
Nov 10 2004, 02:12 PM
it really helps me....(when I inserting HTML in my site..) tongue.gif

Reply

abcde
Nov 10 2004, 02:38 PM
Simple things you didn't mension:

CODE
<i>To make your text Italic</i>

CODE
<b>To make your text bold.</b>

CODE
<u>To underline yout text</u>

Reply

Fatal-Fatality
Nov 10 2004, 08:51 PM
thanks guys, I was kind of rushed, any more input, please give it, the more that people know, the better the websites! biggrin.gif

Reply

skyglow1
Nov 13 2004, 06:53 AM
What I really suggest is using coding style layout of code. Like for every new thing that is nest in soemthing else, you press tab or 2 spaces for margin like this how I do it on my site:

http://www.skyglow1.freenukehosting.com/

Look at the source code to see.

skyglow1

Reply

odirima
Nov 16 2004, 05:31 PM
i had a code how to insert a flash animation but i forget it...
someone can give me?

Thanks biggrin.gif

Reply

Latest Entries

Crazy Photon
Feb 22 2005, 04:47 PM
Unordered lists:

CODE
<ul>

   <li>Element

   <li>Element

   <li>Element

</ul>


Ordered lists:

CODE
<ol>

   <li>Element

   <li>Element

   <li>Element

</ol>

Reply

DSadmin
Jan 1 2005, 05:00 AM
Well i saw u hadn't mentioned META tags, so here goes:

(i'm not a code guru so i'm not sure how to explain it and stuff...) :shock:

Meta tags tell searches and gots (i think they do) the author of the site, keywords, and content type like html php and stuff. They can tell more stuff but i don't know what that is... ohmy.gif

Example: (this would be between the HEAD tags of a page)

CODE


<META name="Author" content"AUTHORS NAME HERE">

<META name="keywords" content"KEYWORDS, HERE, SEPARATED, BY, COMAS">

<META http-equiv="Content-Type" content"CODE TYPE YOU USE LIKE PHP  AND HTML">



This should help your site rakings is search engines and stuff. :mrgreen:

Hope it helps :wink:

Edit: The paragraph tag, <p>. Well it makes paragraphs.... ohmy.gif

Example:

CODE
<p>THIS IS A PARAGRAPH</p>

<p>THIS IS ANOTHER PARAGRAPH</p>

<p>AND THIS IS A PARAGRAPH ASWELL</p>



well, i think thats it...

Reply

MCK9235
Dec 22 2004, 07:09 PM
Inserting JS
CODE


<html>

<head>

</head>

<body>

<script language="javascript etc">

window.alert("Hola!");

</script>

<!-- End JS -->

</body>

</html>


Adds JS to your site.
CODE
<!--
starts a comment
CODE
-->
ends a comment
the text inbetween is tottally ignored, the browser sees a <!-- and it skips it.
Doctypes
Although not required for your site to be considered valid it must have a doctype here is the HTML 4 transitional one:
CODE


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


Reply

skyglow1
Dec 22 2004, 07:04 PM
If you want to make sure you have correct html on your page, use this HTML verifier and put the link of your website into it:

http://validator.w3.org/

skyglow1

Reply

MCK9235
Dec 22 2004, 02:14 PM
Links
Tag: <a> stands for anchor.
CODE


<a href="yourdomain.tld">MY site!</a>


Mailto:
CODE


<a href="mailto:you@domain.tld">E-Mail Me!</a>


Reply


Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.
Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

Pages: 1, 2
Recent Queries:-
  1. e card html tutorial - 244.51 hr back. (1)
  2. html tutorial ecard - 878.02 hr back. (1)
Similar Topics

Keywords : Html

  1. Html Email - (3)
  2. How Long Did it take you to learn HTML - (78)
    Hey, Im interested in learning HTML and i was just wondering how long you think it might take...
  3. Does This Link Work For You? - http://68.203.246.27:8080/index.html (6)
    does this link work for you? i need to take a test online but the link doest works =-\
    http://68.203.246.27:8080/index.html ...
  4. html bilder - (4)
    i need html bilder some one can help me...
  5. Linking CSS to HTML - (2)
    CODE Linking to an External Style Sheet --- LINK tag The link tag is
    used between the HEAD tags. It is the most common way to link CSS to HTML. REL Attribute
    The REL attribute defines the differences between a persistent or preferred style and an alternate
    style. - Preferred style is the style that is automatically applied to the page. - Alternate
    style is a style which the user could choose to replace the preferred style. MEDIA Attribute
    screen - (default value) for computer screens print - output to a printer ...
  6. HTML - (4)
    I need a script , I dont know how to o 'If i click the links on my websites,the text in the middle
    of site is change to what it suppose to be...' someone help me....
  7. http://www.cheapdesign.co.uk/pulseradio/index.html - (7)
    i have not yet completed this website, because i dont currently have webhosting. but my mate has let
    me upload this website temp so that you can see a sneak preview
    http://www.cheapdesign.co.uk/pulseradio/index.html ...
  8. Newpass2.html malware - (0)
    So, I was chatting it up with some people, and this one person says she got hit by some weird piece
    of adware from www.lop.com/.../newpass2.html. So, smart as I am, I click on the link... and now,
    when I maximize my IE window, it's all forced down to the bottom of the screen so that only like the
    top couple of toolbars are visible. Anyone have suggestions? If you need a Hijackthis log...
    Logfile of HijackThis v1.99.1 Scan saved at 10:47:14 PM, on 3/6/2005 Platform: Windows XP SP1
    (WinNT 5.01.2600) MSIE: Internet Explorer v6.00 SP1 (6.00.2800.1106) Running proces...
  9. Need: Public_html file... - (2)
    I deleted it cuzz I thought I didn't need it :S Please someone send me it!!!...
  10. How to send HTML mail to yahoo inbox - (1)
    I have a Ecard site . I want to send ecard in HTML mail format, but my site alway send to BULK.
    Does anyone know a site where i can send HTML mail to Yahoo Inbox....
  11. Javascript/HTML form submissions On a Mac - (1)
    My hope is that someone out there can help me with this problem. I have some javascript that will go
    thru (on a PC that is) a HTML page looking for a specifc word submitted via an onclick function.
    Orginally it was a form submission with an onsubmit that ran the function. But in trying to
    trouble shoot it I thought the mac was submitting the form differently than the PC versions (maybe
    the DOM) so I created a button with an onclick command. Again it works for the PC but not for the
    MAC. I am at my wits end. If someone can help; below is the code I am using. I...
  12. html - (6)
    does anyone know if the html used in myspace will work on a normal webpage..?...
  13. HTML - (2)
    Hello FNH-Staff/Helpers..i was wondering.. i no very little of cpanel..like most of it..just the
    installing crap is confusing. well i have a www.freewebs.com site.and i was wondering..is there n e
    way to tranfer the files to the cpanel..if so is there n e way that i can get help..i would really
    appreciate great assistance.tyvm for ure time..and hopes to ttyl.bye Invigor8...
  14. html imput select help - (0)
    I would like to know, how I delete an options of "imput select" with source code. Thanks...
  15. html imput file - (0)
    I would like to know if is possible to cange the file of the "html imput file" with source code
    Thanks...
  16. Need How MAny On HTML Code or etc. - (2)
    OKIDOKIE CLICK HERE ...
  17. Your Favorite Html/webdesign Boards? - Whats yours? (2)
    What is your favorite webdesign/tutorial forum? I have heard lissaexplains forum is pretty good
    (from word of mouth, i have not auctally been there lol) but I dont really go on many unless its my
    last resort, for thoes of you who love tutorial forums what ones are helpful to you and fun to go
    on? Let us know!...
  18. Getting HTML source code of a remote page. - (2)
    Hi there, I'm trying to get the source code of a page hosted on another domain using JS. I've
    tried a couple of methods but nothing seems to work with pages located on a remote host. I know this
    could be easily done using a server-side script, but my question is: it is possible to do it with
    JS? Thanks in advance....
  19. More HTML templates - (12)
    QUOTE http://speedydiz.webdynamit.net/kits/kit9/Kit9.zip 
    http://speedydiz.webdynamit.net/kits/kit2/Kit2.zip  
    http://speedydiz.webdynamit.net/kits/kit5/kit5.zip  
    http://speedydiz.webdynamit.net/kits/kit7/Kit7.zip  
    http://speedydiz.webdynamit.net/kits/kit8/Kit8.zip  
    http://speedydiz.webdynamit.net/kits/kit14/Kit14.zip  
    http://speedydiz.webdynamit.net/kits/kit6/kit6.zip  
    http://speedydiz.webdynamit.net/kits/kit12/Kit12.zip  
    http://speedydiz.webdynamit.net/kits/kit3/Kit3.zip  
    http://speedydiz.webdynamit.net/kits/kit11/Kit11.zip   http://speed...
  20. html and php - (7)
    Hello, I wanna put the following html code in my php-nuke website: CODE
    But I can't put it there cause the html tags are not allowed. Can anyone help me? /sad.gif'
    border='0' style='vertical-align:middle' alt='sad.gif' /> Greetz, N!ghtwarr!or...
  21. HTML/vWar Panel - (0)
    i was wondering if n e body has ever heard of vWar Panel..if not check it out... www.vwar.de very
    great tool for clans and such..but i was wondering if n e body nows what it is and nows how to
    script with html...or however u say..that would b great..well what i meen is combining both of the
    scripts for n html template..cuz it is usually for phpnuke..just its really hard to combine it with
    html..let me no n e body..it would b great to have help...tyvm.bye...
  22. html pages in php-nuke - (2)
    is there any way to add html pages in a php-nuke site if its possible then plzz tellme how :?: i
    m waiting for reply...
  23. html in php - (12)
    Hi, 2 things, 1) I"m looking for anice begginers tut for php... please. 2) How to insert an html
    tag in to php file? something like , and so on... Thanks, and sorry for my english... :S...
  24. HTML - (7)
    Can we combine HTML with database?...
  25. Can we use HTMl as first language - (6)
    Can we use HTMl as first language...
  26. HTML - (7)
    How to combine HTMl with CSS?...
  27. I need simple html editor script - (3)
    I need it because i think it is easy to edit my pages. And with login, for admin. Pls, help me!
    ThanX!...
  28. php and html help - (2)
    i am new to php and html but learning,just wondering if there is any other easy way to learn it...
  29. How do you change a html layout to a php theme?? - (7)
    can anyone teach me??...
  30. Free HTML Templates - (23)
    Feel free: http://webtemplateszone.com/templates/templates_1.htm
    http://www.zymic.com/templates/ http://www.templatesbox.com/ http://aethereality.net/
    <===Cool layout...






Looking for basic, html






*SIMILAR VIDEOS*
Searching Video's for basic, html
Watch the latest videos on YouTube.com

*MORE FROM TRAP17.COM*
advertisement



Basic HTML Tutorial