4.1 a, href címkék

Nos, továbbra sem felejtjük el, hogy Java programozót készítünk belőled, így csak 5 címkét kell megtanulnod.

Először is, ez a legfontosabb címke, amely a szöveget hipertextgé alakítja - link . Hivatkozások létrehozásához HTML-ben egy címkét <a>(horgonyból, horgonyból) használnak.

Az alapértelmezett hivatkozás így néz ki:

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

Ahol kék az a szöveg, amit a felhasználó lát, zöld pedig az a cím (link), amelyre a link szövegére kattintva eljut.

Egy tipikus hivatkozásokat tartalmazó HTML dokumentum így néz ki:


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

Nem, általában így néz ki:



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

A világ nem tökéletes.

4.2 img tag és src attribútum

Egy kép beszúrásához egy HTML-oldalra egy címkét <img>(a kép szóból) használunk. Ez egyetlen címke, nincs záró címkéje. A címke általános nézete:

<img src="image link">

Minden nagyon egyszerű. Ha egy képet szeretne megjeleníteni a HTML-dokumentumban, csak ismernie kell a képre mutató hivatkozást, és használnia kell a img. Próbáld ki, tetszeni fog.

4.3 A táblázat elem

Ezenkívül egy HTML-oldal tartalmazhat adatokat tartalmazó táblázatot. De itt nem boldogulsz egy címkével, ha jobban belegondolsz. Végül is egy táblázatnak van fejléce, sorai, oszlopai és cellái. Mindannyian saját címkéket találtak ki:

  • <table>- maga az asztal;
  • <tr>( table r ow ) – sortábla;
  • <th>( table h header) – táblázat fejléc cellája;
  • <td>( table data ) – táblázatcella.

Így nézne ki egy 3:3 táblázat html(egy extra fejlécsorral)


<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>

Bár most a táblázatokat ritkán használják. A helyzet az, hogy telefonról nézegetve hasznos lehet a táblázat más módon történő megjelenítése (egyszerűen nem fér el a képernyőn). De még mindig tudnia kell, hogyan vannak elrendezve az asztalok.

4.4 id és név attribútumok

És még két fontos pont a idés attribútumok name. Ezek attribútumok, nem címkék, de nagyon gyakran használják őket.

idA tag attribútum lehetővé teszi, hogy a teljes dokumentumon belül egyedi nevet adjon neki . Ez akkor hasznos, ha a HTML dokumentumban van valamilyen JavaScript, amely megváltoztatja az adott címke értékét vagy paramétereit. Ezután az egyedi segítségével idpontosan hivatkozhat a kívánt címkére.

Egy attribútum namehasonló funkciót lát el, de értékének nem kell egyedinek lennie az oldalon. Vagyis elméletileg több azonos nevű címke is lehet. Ez az elemcsoportokkal való munka megkönnyítése érdekében történik.

Például egy oldalon több lista található, amelyek mindegyikében csak egy elemet választhat ki. Ezután a lista új elemének kiválasztásakor vissza kell állítania a lista többi elemének kiválasztását. De ne érintsen meg más listákat. Ez könnyen megtehető, ha ugyanazon lista minden elemének azonos a neve.

Bármely címke rendelkezhet attribútumokkal idés name. Példa:


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