4.1 a, href-tags

Nå, vi glemmer stadig ikke, at vi forbereder en Java-programmør ud af dig, så du behøver kun at lære 5 tags.

For det første er dette det vigtigste tag, der gør tekst til hypertekst - link . For at lave links i HTML <a>bruges et tag (fra anker, anker).

Standardlinket ser sådan ud:

<a href="link-address">link text</a>

Hvor blå er den tekst, som brugeren ser, og grøn er den adresse (link), som han vil gå til, hvis han klikker på teksten i linket.

Et typisk HTML-dokument, der indeholder links, ser sådan ud:


<html>
    plain text
        <a href="http://codegym.cc/about">
            Link to something interesting
          </a>
     some other text...
</html>
Java webinar

Nej, det ser normalt sådan ud:



<html>
    plain text  <a href="http://codegym.cc/about">Link to something interesting</a> some other text...
</html>

Verden er ikke perfekt.

4.2 img tag og src attribut

For at indsætte et billede på en HTML-side <img>bruges et tag (fra ordet billede). Dette er et enkelt tag, det har ikke et afsluttende tag. Generel visning af tagget:

<img src="image link">

Alt er meget enkelt. For at vise et billede i dit HTML-dokument skal du blot kende linket til det billede og bruge img. Prøv det, du vil kunne lide det.

4.3 Bordelementet

En HTML-side kan også indeholde en tabel med data. Men her kan du ikke klare dig med ét mærke, hvis du tænker over det. En tabel har trods alt en overskrift, rækker, kolonner og celler. De kom alle med deres egne tags:

  • <table>- selve bordet;
  • <tr>( table r ow ) – række tabel;
  • <th>( table h header) – tabeloverskriftscelle ;
  • <td>( table data ) – tabelcelle.

Sådan ser en 3 gange 3 tabel ud html(med en ekstra overskriftsrække)


<table>
    <tr> <th>Surname</th> <th>Name</th> <th>Surname</th> </tr>
    <tr> <td>Ivanov</td> <td>Ivan</td> <td>Ivanovich</td> </tr>
    <tr> <td>Petrov</td> <td>Peter</td> <td>Peterovich</td> </tr>
    <tr> <td>Sidorov</td> <td>Kolia</td> <td>Sidorenko</td> </tr>
</table>

Selvom nu tabeller er sjældent brugt. Sagen er, at når man ser en side fra en telefon, kan det være nyttigt at vise tabellen på en anden måde (den passer simpelthen ikke på skærmen). Men du skal stadig vide, hvordan bordene er arrangeret.

4.4 id- og navneattributter

Og yderligere to vigtige punkter er idog attributterne name. Disse er attributter, ikke tags, men de bruges meget ofte.

idTag- attributten giver dig mulighed for at give den et navn , der er unikt i hele dokumentet . Dette er nyttigt, hvis der er noget JavaScript i HTML-dokumentet, der ændrer værdien eller parametrene for det givne tag. Derefter, ved hjælp af unikke, idkan du præcist henvise til det ønskede tag.

En attribut nameudfører en lignende funktion, men dens værdi behøver ikke at være unik på siden. Det vil sige, at der teoretisk set kan være flere tags med de samme navne. Dette gøres for at gøre det nemmere at arbejde med grupper af elementer.

For eksempel er der flere lister på en side, hvor du kun kan vælge ét element. Når du derefter vælger et nyt element på listen, skal du nulstille valget af de resterende elementer på listen. Men rør ikke ved andre lister. Dette kan nemt gøres, hvis alle elementer i den samme liste har samme navn.

Ethvert tag kan have både attributter idog name. Eksempel:


<img id="image123" name="avatar" src="link to picture">