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 &nbsp; &Auml; &Auml; &Uuml; &szlig &lt; / &quot; 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 (ß) </> "/& / &auml; / &auml; / &uuml; &gt; / &amp; 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 ©