Internet A HTML Grunder 3112021 1 HTML Grund
- Slides: 40
Internet A HTML Grunder 3/11/2021 1
HTML Grund HTML Tags (Speciella markeringar) < Instruktion> De flesta instruktioner avslutas också med en <Instruktion> </Instruktion> 3/11/2021 2
HTML Grund <html> <head> <title>Untitled</title> </head> <body> Min nya hemsida </body> </html> 3/11/2021 3
HTML Grund Kommentarer kan skrivas: <!-- Kommentarer --> <!-- Max har gjort detta!! --> <html> <head> <title>Maximilien Chiang</title> </head> <Body> Min nya hemsida </body> </html> 3/11/2021 4
HTML Grund Attribut Värde Background Bgcolor Text Link Alink Vlink Address till bild Bakgrundsfärg Textfärg Färg på länkar i passivt tillstånd Färg på länker i aktivt tillstånd Färg på redan besökta länkar 3/11/2021 5
HTML Grund <!-- Max har gjort detta!! --> <html> <head> <title>Maximilien Chiang</title> </head> <Body bgcolor = "#F 00000" Text ="#FFF 000" link ="#FFFF 00" alink ="#FFFF 00" vlink ="#FFFFF 0"> Min nya hemsida </body> </html> 3/11/2021 6
HTML Grund <!-- Max har gjort detta!! --> <html> <head> <title>Maximilien Chiang</title> </head> <Body bgcolor = "#F 00000" Text ="#FFF 000" link ="#FFFF 00" > Min nya hemsida hej igen </body> </html> Detta leder inte till någon radbrytning. 3/11/2021 7
HTML Grund <!-- Max har gjort detta!! --> <html> <head> <title>Maximilien Chiang</title> </head> <Body bgcolor = "#F 00000" Text ="#FFF 000" link ="#FFFF 00" > Min nya hemsida hej igen </body> </html> Detta leder till en radbrytning. 3/11/2021 8
HTML Grund Rubriker <h 1> rubrik </h 1> Attributer: left, right, center. ----------------------------<!-- Max har gjort detta!! --> <html> <head> <title>Maximilien Chiang</title> </head> <Body bgcolor = "#F 00000" Text ="#FFF 000" > <h 1>Min nya hemsida </h 1> </body> </html> 3/11/2021 9
HTML Grund Stycke indelning <body> <p> text </p> <p align =”center”> </body> Attributer: left, center, right Horisontell linje <body> text över linjen <hr> text under linjen </body> 3/11/2021 10
HTML Grund Obruten text <body> Vi kan knyta ihop förkortningar, som t ex och bl a. </body> Eller <nobr> Denna rad kan endast brytas <wbr> på ett ställe. </nobr> 3/11/2021 11
HTML Grund Stilar Instruktion Hur Stil I <i> text </i> Kursiv B <b> text </b> Fet U <u> text </u> Understruken S <s> text </s> Genomstruken Tt <tt> text </tt> Kod Sub <sub> text </sub> Index Sup <sup> text </sup> Exponent Blink <blink> text <blink> Blinkande Cite <cite> text </cite> Citat Strong <strong> text </strong> Framhävd text Code <code> text </code> Programkod 3/11/2021 12
HTML Grund Fonter <body> <font face = ”Arial”> Text med Arial utseende </font> </body> 3/11/2021 13
HTML Grund Färg och Storlek <body> <font face = ”Arial” color = ”red” size = ” 6”> Arial, röd och storlek 6 </font> </body> Attributer: color size 3/11/2021 red, blue, green 1, 2 …. 7 14
HTML Grund Textens storlek relativt den senast angivna storleken. (normal = 3) <body> <font face = ”Arial” color = ”red” size = ”+3”> Arial, röd och storlek 6 </font> </body> 3/11/2021 15
HTML Grund Förformaterad text sätter HTML: s regler om white-space ur spel. Med hjälp av instruktioner pre tolkas texten exakt som den står. <body> <pre> Detta text kommer att se så här ut. </pre> </body> 3/11/2021 16
HTML Grund Listor Onumrerad lista <body> <ul> <li>första rad <li>andra rad <li>tredje rad </ul> </body> 3/11/2021 17
HTML Grund Vi kan även ändra punktens utseende med attributet typ. Attribut: Värde: type square, disc, circle <body> <ul type = ”circle”> <li>första rad <li type=”disc”>andra rad <li>tredje rad </ul> </body> 3/11/2021 18
HTML Grund Numrerad lista <body> <ol> <li>första rad <li>andra rad <li>tredje rad </ol> </body> Attribut Start Value Type 3/11/2021 Värde 1, 2, 3, …. . 1, I, i, A, a 19
HTML Grund Numrerad lista (forts. . ) <body> <ol start =” 4” type =” 1”> <li>första rad <li value=” 12”>andra rad <li>tredje rad </ol> </body> 3/11/2021 20
HTML Grund Definitionslista <body> <dl> <dt>Definitioner <dt>Bilar <dd>opel <dt>Båtar <dd>segelbåt </dl> </body> 3/11/2021 21
HTML Grund Tabeller En tabell består av rader som i sin tur består av celler. Tabellen kan även innehålla en eller flera rubrikceller. En cell kan sträcka sig över flera rader och kolumner. <body> <Table border> <caption>Rubrik</caption> <tr><th>Namn <th>tel. <tr><td>Max <td>14 87 86 <tr><td>Max <td>070 576 33 26 </table> </body> 3/11/2021 22
HTML Grund Tabeller (forts. . . ) Atribut width height rowspan colspan Align Valign Border Bgcolor 3/11/2021 Värde antal pixlar (ex 40) antal pixlar (ex 20) 2… 2… left, right, center top, middle, bottom 1… white, red, black 23
HTML Grund Tabeller (forts. . . ) <body> <Table border = ” 1”> <caption>Rubrik</caption> <tr> <th colspan=” 2” align=”center”>Hej <tr> <td rowspan=” 2”>Max </tr> <td>Max igen </tr> <td>Max =)) </td> </table> </body> 3/11/2021 </tr> 24
HTML Grund Länkar och bildar En länk, eller hypertextlänk är en förbindelse från en punkt i ett dokument till början av ett annat dokument, till en punkt i samma dokument eller till en punkt i ett annat dokument. Länkar till andra dokument <body> <a href=”sida 2. htm”>Dokument 2</a> <a href=http: //www. mh. se>Mitthögskolan</a> </body> 3/11/2021 25
HTML Grund Länkar inom samma dokument Istället för att ange en adress som värde till href anger vi ett grindtecken (#) följt av ett namn. Detta namn ska finnas någon annanstans i dokumentet i ainstruktionen me attributet name. <body> <a href=”#hoppa”>Hoppa</a>. . . <a name=”hoppa”> Nu är jag här! </body> 3/11/2021 26
HTML Grund Länkar till en punkt i ett annat dokument <body> <a href=”sida 2. htm#hoppa”>Hoppa</a> </body> <a name=”hoppa”> Nu är jag här! </body> 3/11/2021 27
HTML Grund Bilder En bild definieras med instruktionen img, bildens adress anges med attributet scr. <body> <img src=”bild. gif”> </body> Adressen kan vara fullständigt eller relativ Attribut align 3/11/2021 Värde En text skrivs ut om webbläsaren inte kan läsa bilder left, right, top, middle, bottom 28
HTML Grund Bild som länk <body> <a href=http: //www. mh. se><img src=”bild. gif”></a> </body> Del av bild som länk <body> <map name=”karta”> <area shape=”rect” coords=” 1, 1, 100” href=”sida 2. htm”> </map> <img src=”bild. jpg” width=” 100” heigth=” 100”ismap usemap=”karta”> </body> 3/11/2021 29
HTML Grund Adressformat (länkar) format exempel http file mailto News ftp http: //www. mh. se file: //c: windowsdoc 1. doc mailto: max. chiang@ite. mh. se news: //news. se ftp: //ftp. sunet. se 3/11/2021 30
Ramar HTML Grund <html> <head> <title>Hemsida</title> </head> <frameset> Sida med ramar <noframe> <body> Sida utan ramar </body> </noframe> </frameset> </html> 3/11/2021 31
HTML Grundstruktur ramar <frameset rows=” 50%, 50%”> <frame src=”sida 1. htm”> <frame src=”sida 2. htm”> </frameset> 3/11/2021 32
Ramar (forts. . . ) HTML Grund <frameset cols=” 50%, 50%”> <frameset rows=” 25%, 75%”> <frame src=”sida 1. htm”> <frame src=”sida 2. htm”> </frameset> <frameset rows=” 75%, 25%”> <frame src=”sida 3. htm”> <frame src=”sida 4. htm”> </frameset> 3/11/2021 33
HTML Grund Klicka i en ram och ladda i en annan Genom att använda attributet target länk-instruktionen kan man styra i vilken ram sidan ska laddas. I ram instruktionen måste de olika ramarna namnges. <frameset row=” 200, *> <frame src=”sida 5. htm” name=”meny”> <frame src=”sida 6. htm” name =”innehall”> </frameset> 3/11/2021 34
HTML Grund Klicka i en ram och ladda i en annan (forts…. ) Exempel på sida 5. htm <html> <head> <title>Sida 5 </title> </head> <body bgcolor=”#00 FF 00”> <h 1 align=”center”><a href=”sida 1. htm” target=”innehall”> Ladda i den andra ramen</a></h 1> </body> </html> 3/11/2021 35
HTML Grund Attribut till frame-instruktionen Attribut Scrolling Marginwidth Marginheight Noresize Frameborder 3/11/2021 Värde no, yes, auto 0, 1…. 0, 1, …. 36
HTML Grund Ljud Med hjälp av fölande instruktion kan man lägga in bakgrundsmusik <bgsound src=”ljud. mid” loop=”infinite”> Ljud filen kan vara i formaten: MIDI AU WAV 3/11/2021 37
HTML Grund Den professionella hemsida Formulera dina mål. Kommersiella och professionella webbprojekt fyller i allmänhet tre funktioner: • Skyltfönster • Butik • Kundkontakt 3/11/2021 38
HTML Grund Den professionella hemsida (forts. . ) Web- projektets struktur Skissa med papper och penna hur de olika sidorna ska se ut. Hålla samma projektet tillen enhet , strukturera logiskt och lättbegripligt. · Läsaren ska på ett tidigt stadium få en god uppfattning vad webbprojektet omfattar. · Flata och djupa strukturer · Enhetlig layout · Länkar inom projektet 3/11/2021 39
HTML Grund Den professionella hemsida (forts. . ) Tid På en genomsnittlig hemsida är 20% av alla träffar kortare än 10 sekunder och bara 5% av alla träffar är längre än 1 minut. Optimera grafiken. Testa • Netscape och Microsoft Explorer? • Vilken är målgruppen? (förväntad hårdvaruprestanda) • Nedladdningstid ? • Gör dig synlig på nätet! • 60% av alla som första gången besöker ett företags hemsida kommer direkt från en sökmotor. 3/11/2021 40
Besittningsbrytande grunder
Statistikens grunder
Jordabalken hyreslagen
Grunder i kriskommunikation
Statistikens grunder
Gemensamma grunder
Gründer der modernen türkei
"brazuelo grund"
A grund térképe
Omvandla näringsfastighet till privatbostad
Aus diesem grund komma
3112021
Makalah akreditasi rumah sakit
Format of assembly language
3112021
Huntersville police report
3112021
3112021
3112021
3112021
What is internet
Html
12.html?action=
Bhtml?title=
Canvas доска
1
Nombres de
10 internet etiquette
Internet nuts and bolts view
Internet marketing pricing
Xanadoo internet
10 regole per navigare sicuri su internet
Which type of address is this: a3:34:45:11:92:f1
Homebanking poštanske štedionice
The four i's of internet marketing include
Internethastighed telestyrelsen
Akses internet its
Elementos vivos e não vivos
Internet 2-0
Internet für einsteiger deutschland
Iis php
