Titel - BHAK Amstetten

Werbung
WEBDESIGN
Wichtige TAG's
HTML
Grundsätzliches
HTML (HyperText Markup Language) ist eine Seitenbeschreibungssprache mit der dem Browser
mitgeteilt wird, wie er einen bestimmten Text, welches Bild usw. er anzeigen soll.
Das Grundelement von HTML ist ein sogenannter TAG. Jeder TAG hat eine Stelle an der er beginnt
(<b>) und an der er endet (</b>). Alles was zwischen Anfangs- und Endtag steht, wird gemäß den
WWW-Konventionen angezeigt.
Viele TAG's können um Attribute erweitert werden. So kann bei einer Tabelle beispielsweise
angegeben werden, wie dick der Rahmen sein soll: <table border="2">.
Tags & Attribute
Grundsätzlicher Aufbau einer HTML-Seite
<html>
<head>
<title>Text, der in der Titelleiste angezeigt wird</title>
<meta name="author" content="Helmut Wurzer">
<meta name="keywords" content="Schule, HAK, Amstetten">
<meta name="description" content="Website BHAK/BHAS Amstetten">
</head>
<body>
<h1>Alles was innerhalb des body’s steht, wird im Browser angezeigt </h1>
</body>
</html>
Link definieren
<a href="seite2.htm" target="name_des_frames">...</a>
<a href="seite2.htm" target="_blank">...</a>
<a href="mailto:[email protected]">...</a>
Bild einbinden (image)
<img src="images/bild1.jpg" alt="Bild 1">
Tabelle (mit 2 Zeilen zu je 2 Spalten)
<table cellpadding="0" cellspacing="2" border="0">
<tr>
<th>Überschrift 1. Spalte</th>
<th>Überschrift 2. Spalte</th>
</tr>
<tr>
<td>Inhalt einer Tabellenzelle</td>
<td>Inhalt einer Tabellenzelle</td>
</tr>
</table>
table row
table head
table row
table defintion
Aufzählung (geordnet und ungeordnet)
<ol>
<li>1. Aufzählungspunkt</li>
<li>2. Aufzählungspunkt</li>
</ol>
<ul>
<li>1. Aufzählungspunkt</li>
<li>1. Aufzählungspunkt</li>
</ul>
Stylesheet einbinden (innerhalb von <head></head>)
<link rel="stylesheet" href="styles/stylesheet.css" type="text/css">
BHAK/BHAS Amstetten
Helmut Wurzer ©
WEBDESIGN
Wichtige TAG's
HTML
JavaScript einbinden (innerhalb von <head></head>)
<script language="javaScript" src="js/javascript.js"></script>
Frameset definieren
<frameset rows="50,*">
<frame name="frmTop" src="oben.htm" scrolling="no" frameborder="0">
<frameset cols="100,*">
<frame name="frmLeft" src="links.htm" scrolling="no" border="0">
<frame name="frmRight" src="rechts.htm" scrolling="auto" noresize>
</frameset>
</frameset>
Layer definieren
<div id="Lay1" style="position:absolute; top:50px; left:20px;
width:20px; height:10px;">
Hier kann Text oder ein Bild eingefügt werden.
</div>
Nicht angezeigter Text (Kommentar )
<!— Dieser Text wird im Browser nicht angezeigt -->
Diverse Tags
Überschrift
Absatz
Fett
Kursiv
Zeilenumbruch
Linie
Aufzählung
Listeneintrag
Beispiel
Bedeutung
<h1>Überschrift</h1> (<h2>.....<h6>)
<p>Nach dem Ende von p erfolgt ein Zeilenumbruch</p>
Das Wort <b>Amstetten</b> wird fett angezeigt.
Das Wort <em>Amstetten</em> wird kursiv angezeigt.
<br>
<hr>
<ul> oder <ol>
<li>1. Aufzählungspunkt</li>
header
 
Ä
Ä
Ü
&szlig
< /
"
non breaking space
bold
emphase
break
horizontal line
(un)orderd list
list item
Sonderzeichen
Leerzeichen
Umlaut A/a
Umlaut O/o
Umlaut U/u
scharfes s (ß)
</>
"/&
/ ä
/ ä
/ ü
>
/ &
Diverse Attribute
Attribut
Beispiel
Bedeutung
width
<td width="100">XY</td>
<td width="100">XY</td>
<table border="1">
<table cellpadding="1">
<table cellspacing="1">
Breite in Pixel oder Prozent
height
border
cellpadding
cellspacing
BHAK/BHAS Amstetten
Höhe in Pixel oder Prozent
Rahmenstärke
Abstand zwischen Zellen und Inhalt
Abstand zwischen Tabellenzellen
Helmut Wurzer ©
Herunterladen