İlk Kodlar…
Etiket, HTML dosyasında kullanılan komutlara verilen addır. HTML içinde kullanılan tüm etiketler “<” işareti ile başlar ve “>”ile biter. Ayrıca etiketin yorum aralığı da “</etiket ismi>” kalıbı ile bitirilir. Aşağıda etiket kullanımına kısa bir örnek verilmektedir.
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
<h1>This is a heading</h1><h2>This is a heading</h2><h3>This is a heading</h3>
</body>
</html>
Link Verme. Sayfa-1
<html>
<body>
<h1>This is my Main Page</h1>
<p>This is some text.</p>
<p><a href="page1.htm">This is a link to Page 1</a> </p>
<p><a href="page2.htm">This is a link to Page 2</a> </p>
</body>
</html>
Paragraf Oluşturma
<p>This is a paragraph.</p><p>This is another paragraph.</p>
Başka bir sayfaya link verme
<html>
<body>
<a href=http://www.maltepe.edu.tr> This is a link</a>
</body>
</html>
Sayfa İçerisine Resim Ekleme
<img src=“deneme.jpg" width="104" height="142" />
Yeni satır oluşturma
<br>
<p>This is a paragraph</p><hr /><p>This is a paragraph</p><hr /><p>This is a paragraph</p>
<html>
<body>
<!--This comment will not be displayed-->
<p>This is a regular paragraph</p>
</body>
</html>
<p>This is<br />a para<br />graph with line breaks</p>
<html>
<body>
<p><b>This text is bold</b></p>
<p><strong>This text is strong</strong></p>
<p><big>This text is big</big></p>
<p><i>This text is italic</i></p>
<p><em>This text is emphasized</em></p>
<p><code>This is computer output</code></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
</body>
</html>
<html>
<body>
<p>
<font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
</font>
</p>
<p>
<font size="3" face="verdana" color="blue">
This paragraph is in Verdana, size 3, and in blue text color.
</font>
</p>
<p>The font element is deprecated in HTML 4. Use CSS instead!</p>
</body>
</html>
<html>
<body style="background-color:PowderBlue;">
<h1>Look! Styles and colors</h1>
<p style="font-family:verdana;color:red;">
This text is in Verdana and red</p>
<p style="font-family:times;color:green;">
This text is in Times and green</p>
<p style="font-size:30px;">This text is 30 pixels high</p>
</body>
</html>
<html>
<body style="background-color:yellow;">
<h2 style="background-color:red;">This is a heading</h2>
<p style="background-color:green;">This is a paragraph.</p>
</body>
</html>
<html>
<body>
<h1 style="font-family:verdana;">A heading</h1>
<p style="font-family:arial;color:red;font-size:20px;">
A paragraph.</p>
</body>
</html>
<html>
<body>
<h1 style="text-align:center;">Center-aligned heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
<html>
<body>
<a href="http://www.maltepe.edu.tr" target="_blank">Visit Maltepe University!</a>
<p>If you set the target attribute to "_blank", the link will open in a new browser window/tab.</p>
</body>
</html>
<html>
<body>
<h2>Norwegian Mountain Trip</h2>
<img border="0" src="/images/pulpit.jpg" alt="Pulpit rock" width="304" height="228" />
</body>
</html>
<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
<table border="1"><tr><th>Header 1</th><th>Header 2</th></tr><tr><td>row 1, cell 1</td><td>row 1, cell 2</td></tr><tr><td>row 2, cell 1</td><td>row 2, cell 2</td></tr></table>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
<form>First name: <input type="text" name="firstname" />
<br />Last name: <input type="text" name="lastname" /></form>
<form>Password: <input type="password" name="pwd" /></form>
<form><input type="checkbox" name="vehicle" value="Bike" /> I have a bike<br /><input type="checkbox" name="vehicle" value="Car" /> I have a car </form>
<form name="input" action="html_form_action.asp" method="get">Username: <input type="text" name="user" /><input type="submit" value="Submit" /></form>
<frameset cols="25%,75%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
</frameset>
<html>
<body>
<iframe src="demo_iframe.htm"
width="200" height="200"></iframe>
<p>Some older browsers don't support iframes.</p>
<p>If they don't, the iframe will not be visible.</p>
</body>
</html>
<html>
<body>
<table width="500" border="0">
<tr>
<td colspan="2" style="background-color:#FFA500;">
<h1>Main Title of Web Page</h1>
</td>
</tr>
<tr valign="top">
<td style="background-color:#FFD700;width:100px;text-align:top;">
<b>Menu</b><br />
HTML<br />
CSS<br />
JavaScript
</td>
<td style="background-color:#eeeeee;height:200px;width:400px;text-align:top;">
Content goes here</td>
</tr>
<tr>
<td colspan="2" style="background-color:#FFA500;text-align:center;">
Copyright Maltepe Üni ?</td>
</tr>
</table>
</body>
</html>
