Jump to content

[Guide] <HTML> Lessons


Recommended Posts

[list][list]How to make a simple website.

Before we start. You just need Notepad open.

Tips:

   * You must always start with this code: <HTML> and end with </HTML> or else nothing will appear.
*

   * When you finish with your project save it as example.html
*

   * When you press Enter in your notepad the browser will ignore it.
*

   * The codes you must use I will mark them with red color.
*



Ok, Let's start...


Lesson 1: Basic


<HTML>
<HEAD>
<TITLE>Lessons 1</TITLE>
</HEAD>

<BODY>
Lessons 1 by ProJecT
<B></B>Is for Bold Letters: ProJecT
<I></I>Is for Italic Letters: ProJecT
<U></U>Is for Underlined Letters: ProJecT
<HR> Add a beautiful line. Below.
<CENTER></CENTER> Put the text at the center of the page. Center not middle!
</BODY>
</HTML>


Lessons 2: Paragraphs


<HTML>
<HEAD>
<TITLE>Lessons 2</TITLE>
</HEAD>

<BODY>

<P>This
<P>is a
<P>Paragraph
</BODY>
</HTML>


Lesson 3: <BR> instead of Enter


Before I start typing I want to remind you that the browser will ignore the change of line with Enter.
You must change the line with this code: <BR>

<HTML>
<HEAD>
<TITLE>Lessons 3</TITLE>
</HEAD>

<BODY>
<BR>We will<BR>Use<BR>our mind<BR>for creating<BR>a HTML document.

</BODY>
</HTML>


Lesson 4: Size of the Letters or headings


<HTML>
<HEAD>
<TITLE>Lessons 4</TITLE>
</HEAD>

<BODY>
<h1>Size 1</h1>
<h2>Size 2</h2>
<h3>Size 3</h3>
<h4>Size 4</h4>
<h5>Size 5</h5>
<h6>Size 6</h6>
</BODY>
</HTML>


Lesson 5: Comment
This comment is useful if you want to change something, but you will not see it in the browser.


<HTML>
<HEAD>
<TITLE>Lesson 5</TITLE>
</HEAD>

<BODY>
<h1>Summer in Greece</h1><!--Change h1 to h2 and i have to make Greece with bold letters.. rofl(this comment will not appear in the browser, it is something like a reminder-->
</BODY>
</HTML>


Lesson 6: Sub(script) and Sup(erscript)


<HTML>
<HEAD>
<TITLE>Lesson 6</TITLE>
</HEAD>

<BODY>
<SUB>A small text up</SUB>
<SUP>A small text down</SUP>
</BODY>
</HTML>


Lesson 7: Pre
<PRE></PRE> Is a code which let the browser to use the space and the enters you used on notepad.


<HTML>
<HEAD>
<TITLE>Lesson 7</TITLE>
</HEAD>

<BODY>
<PRE>I       love      space

and



Enter


a

lot!!</PRE>
</BODY>
</HTML>


Lesson 8: Insert an Adress(Not Website's Adress)

<HTML>
<HEAD>
<TITLE>Lesson 8</TITLE>
</HEAD>

<BODY>
<ADRESS>
Chester Bennington
Minneapolis 554
San Francisco
America
</ADRESS>
</BODY>
</HTML>


Lesson 9: Delete and Inserted Text


<HTML>
<HEAD>
<TITLE>Lesson 9</TITLE>
</HEAD>

<BODY>
This file have been <DELETE>deleted</DELETE> from our <INS>Database</INS>


Lesson 10: Abbreviations


<HTML>
<HEAD>
<TITLE>Lesson 10</TITLE>
</HEAD>

<BODY>
<ABBR TITLE="BRB">Be Right Back</ABBR>
<ABBR TITLE="DNA">Deoxyribonucleic Acid</ABBR>
</BODY>
</HTML>


Lessons 11: Background Color


<HTML>
<HEAD>
<TITLE>Lesson 11</TITLE>
</HEAD>

<BODY BGcolor="red">
Background colored red. You can use another color if you want, special.
Get in Google and find some Color Hex Codes.
You must write BGcolor="#ff12ff"
</BODY>
</HTML>


Lesson 12: Hypertexts


<HTML>
<HEAD>
<TITLE>Lesson 12</TITLE>
</HEAD>

<BODY>
This link will take you to an <a href="http://[/url] Projects.us/">Awesome Website</a>
on World Wide Web(WWW)
<BR>
This link will take you a <a href="forum.html">page</a> on your Website.
</BODY>
</HTML>


Lesson 13: Image - Link


<HTML>
<HEAD>
<TITLE>Lesson 13</TITLE>
</HEAD>

<BODY>
<a href="http://">
<img src="http://[/url]" alt="Lesson 13" width="100" height="100" />
</a>This image have a border around.

<a href="http://">
<img border="0"src="http://" alt="Lesson 13" width="100" height="100" />
</a>This image have not a border around.
</BODY>
</HTML>


Lessons 14: New Browser Window


<HTML>
<HEAD>
<TITLE>Lesson 14</TITLE>
</HEAD>

<BODY>
<a href="http://" target="_blank">New Tab, huh?</a>

</BODY>
</HTML>


Lesson 15: Get to another part of the current page.


<HTML>
<HEAD>
<TITLE>Lesson 14</TITLE>
</HEAD>

<BODY>
<a href="#C2">Take care of Part 2</a><br>
<a href="#C5">Send to a friend the Part 5</a><br>
<a href="#C12">Take a look at Part 12</a><br>
<br><br>
Part 1
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
<a name="C2"><h1>Part 2</h1></a>
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 3
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 4
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
<a name="C5"><h1>Part 5</h1></a>
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 6
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 7
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 8
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 9
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 10
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
Part 11
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
<br><br><br>
<a name="C12"><h1>Part 12</h1></a>
Blah Blah Blah<br>
Blah Blah Blah<br>
Blah Blah Blah<br>
</BODY>
</HTML>


Lesson 15: Vertical and Horizontal Frameset (It's like you have as many as you want websites in your site)
Tip:

   * You don't need <BODY></BODY> here.
*

   * If you want to have Verical and Horizontal togethere after you finish with Vertical start typing for Horizontal without using </frameset>
     (e.x: <frameset cols="50%,50%">
     <frame set rows="50%,50%">
*



<HTML>
<HEAD>
<TITLE>Lesson 14</TITLE>
</HEAD>

<frameset cols="50%,50%">

 <frame src="http://">
 <frame src="http://">

</frameset>
</HTML>


<HTML>
<HEAD>
<TITLE>Lesson 15</TITLE>
</HEAD>

<frameset rows="50%,50%">

 <frame src="http://">
 <frame src="http://">

</frameset>
</HTML>


Lesson 16: Navigation Frame


<HTML>
<HEAD>
<TITLE>Lesson 16</TITLE>
</HEAD>

<frameset cols="120,*">

<frame src="http://>
<frame src="http://"
name="showframe">

</frameset>

</HTML>


Lesson 17: A slamm frame inside your website.
Tip:

[liHere we can use body.]
[*]
[/list]


<HTML>
<HEAD>
<TITLE>Lesson 17</TITLE>
</HEAD>

<BODY>
<iframe src=""></iframe>

</BODY>
</HTML>


Lesson 18: How to make tables
Tips:

[li<TR>Are the lines Horizontal
<TD> Are the lines Vertical]
[*]
[/list]


<HTML>
<HEAD>
<TITLE>Lesson 19</TITLE>
</HEAD>

<BODY>
<Table BGcolor="yellow" Width=400 Align="Left" border=2 BorderColor="black" Cellpadding=3 Cellspacing=0>
<TR>
<TD>Lesson 14</TD><TD>Lesson 14</TD><TD>Lesson 14</TD>
</TR>
<TR>
<TD>Lesson 14</TD><TD>Lesson 14</TD><TD>Lesson 14</TD>
</TR>
<TR>
<TD>Lesson 14</TD><TD>Lesson 14</TD><TD>Lesson 14</TD>
</TR>
<TR>
<TD>Lesson 14</TD><TD>Lesson 14</TD><TD>Lesson 14</TD>
</TR>
<TR>
<TD>Lesson 14</TD><TD>Lesson 14</TD><TD>Lesson 14</TD>
</TR>
</TABLE>
</BODY>
</HTML>


Lesson 20:  Add Color or Image behind the table or the sell.


<HTML>
<HEAD>
<TITLE>Lesson 20</TITLE>
</HEAD>

<BODY>

<Table background="" Width=400 Align="Left" border=2 BorderColor="black" Cellpadding=3 Cellspacing=0>
<TR>
<TD>Lesson 19</TD><TD>Lesson 19</TD><TD>Lesson 19</TD>
</TR>
<TR>
<TD>Lesson 19</TD><TD>Lesson 19</TD><TD>Lesson 19</TD>
</TR>
<TR>
<TD>Lesson 19</TD><TD>Lesson 19</TD><TD>Lesson 19</TD>
</TR>
<TR>
<TD>Lesson 19</TD><TD>Lesson 19</TD><TD>Lesson 19</TD>
</TR>
<TR>
<TD>Lesson 19</TD><TD>Lesson 19</TD><TD>Lesson 19</TD>
</TR>
</TABLE>

</BODY>
</HTML>


Lesson 21: Insert List with dots


<HTML>
<HEAD>
<TITLE>Lessons 21</TITLE>
</HEAD>

<BODY>
<ul>
 <li>Photoshop: Tutorials</li>
 <li>Photoshop: Showcase</li>
 <li>Photoshop: Request</li>
</ul>

</BODY>
</HTML>


Lesson 22: Inset List with numbers


<HTML>
<HEAD>
<TITLE>Lessons 22</TITLE>
</HEAD>

<BODY>
<ol>
 <li>Photoshop: Tutorials</li>
 <li>Photoshop: Showcase</li>
 <li>Photoshop: Request</li>
</ol>

</BODY>
</HTML>


Lesson 23: All types of lists

<HTML>
<HEAD>
<TITLE>Lessons 23</TITLE>
</HEAD>

<BODY>
Numbers List
<ol>
<li>Photoshop: Tutorials</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ol>  

Letters List (Big Letters)
<ol type="A">
<li>Photoshop: Tutorials</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ol>  

Letters List (Small Letters)
<ol type="a">
<li>Photoshop: Tutorials</li>
<li>Photoshop: Showcase</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ol>  

Roman List (Big Letters)
<ol type="I">
<li>Photoshop: Tutorials</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ol>  

Roman List (Small Letters)
<ol type="i">
<li>Photoshop: Tutorials</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ol>  

Black Dots List
<ul type="disc">
<li>Photoshop: Tutorials</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ul>  

White Dots List
<ul type="circle">
<li>Photoshop: Tutorials</li>
<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ul>

Square Dots List
<ul type="square">
<li>Photoshop: Tutorials</li>

<li>Photoshop: Request</li>
<li>Photoshop: Resources</li>
</ul>  

</BODY>
</HTML>


Lesson 24: Defination List


<HTML>
<HEAD>
<TITLE>Lessons 24</TITLE>
</HEAD>

<BODY>
<dl>
 <dt>Photoshop</dt>
 <dd>Tutorials, Showcase, Request, Resources</dd>
 <dt>Lineage II</dt>
 <DD>General Discussion, Bugs & Hacks, Development</dd>
</dl>

</BODY>
</HTML>


Lesson 25: Input Fields


<HTML>
<HEAD>
<TITLE>Lessons 25</TITLE>
</HEAD>

<BODY>
<form action="">
Real name:
<input type="text" name="Real name">
<br>
Username:
<input type="text" name="Username">
</form>

</BODY>
</HTML>


Lesson 26: Login & Password


<HTML>
<HEAD>
<TITLE>Lessons 26</TITLE>
</HEAD>

<BODY>
<form action="">
Username:
<input type="text" name="username">
<br>
Password:
<input type="password" name="password">
</form>

</BODY>
</HTML>


Lesson 27: Check boxes


<HTML>
<HEAD>
<TITLE>Lessons 27</TITLE>
</HEAD>

<BODY>
Who Administrator do you like the most?
<BR>
<form action="">
Anya
<input type="checkbox" name="administrator" value="Anya">
<br />
MasterDisaster
<input type="checkbox" name="administrator" value="MasterDisaster">
<br />
Wizzy
<input type="checkbox" name="administrator" value="Wizzy">
</form>

</BODY>
</HTML>


Lesson 28: Radio-buttons


<HTML>
<HEAD>
<TITLE>Lessons 26</TITLE>
</HEAD>

<BODY>
<form action="">
Anya
<input type="radio" checked="checked"
name="administrator" value="Anya">
<br>
MasterDisaster
<input type="radio"
name="administrator" value="MasterDisaster">
</form>

</BODY>
</HTML>


Lesson 29: Dropdown List


<HTML>
<HEAD>
<TITLE>Lessons 26</TITLE>
</HEAD>

<BODY>
<form action="">
<select name="administrators">
<option value="Anya">Anya</option>
<option value="MasterDisaster">MasterDisaster</option>
<option value="Wizzy">Wizzy</option>
</select>

</BODY>
</HTML>


Lesson 30: Create a Button


<HTML>
<HEAD>
<TITLE>Lessons 30</TITLE>
</HEAD>

<BODY>
<form action="">
<input type="button" value="Continue">
</form>

</BODY>
</HTML>

i have found it in google and i posted here for newbie

Link to comment
Share on other sites

Give credits from where exactly do you find it.

And you know something?we don't really need it.

ALL can google too -.- .

 

Here in maxcheaters,we try(must) to create by ourselves guides/shares.

With that way we may improve kinda better the whole forum.

Link to comment
Share on other sites

Give credits from where exactly do you find it.

And you know something?we don't really need it.

ALL can google too -.- .

i dont disagree with you but i will make the job easy for newbies to find it here....

 

Gredits to elliteplanet

Link to comment
Share on other sites

i dont disagree with you but i will make the job easy for newbies to find it here....

 

Gredits to elliteplanet

Cobra(aka Mossano) is the biggest leecher lol

http://www.maxcheaters.com/forum/index.php?topic=118523.0

http://www.maxcheaters.com/forum/index.php?topic=118645.0

http://www.maxcheaters.com/forum/index.php?topic=118953.0

hf

Link to comment
Share on other sites

 

i dont have see this topics...btw thx...

if you want lock the topic or deleted...

 

 

Link to comment
Share on other sites

Guest
This topic is now closed to further replies.


×
×
  • Create New...