1 / 20

HTML elemek Linkek, táblázatok és képek

HTML elemek Linkek, táblázatok és képek. Forrás, amelyből össze lett állítva a prezentáció szövege és képei: http://www.tutorial.hu/html5-es-css3 /. Képek igazítása. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional //HU" "http://www.w3.org/TR/html4/ loose.dtd "> < html lang ="hu">

teige
Download Presentation

HTML elemek Linkek, táblázatok és képek

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. HTML elemekLinkek, táblázatok és képek Forrás, amelyből össze lett állítva a prezentáció szövege és képei: http://www.tutorial.hu/html5-es-css3/

  2. Képek igazítása <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//HU" "http://www.w3.org/TR/html4/loose.dtd"> <htmllang="hu"> <head> <title>Képek igazítása</title> </head> <body> <p> <imgborder="2" src="kepek/kep_temakor/logo.png" width=„150" height=„50" align="middle" hspace="5" vspace="5" alt=„Drupal logó"> A Drupal egy remek tartalomkezelő rendszer, melyben könnyen dinamikus weblapelemek készíthetőek akár egyetlen kattintással. </p> </body> </html>

  3. Hivatkozások Talán a leglényegesebb tulajdonsága a hiperszövegnek ez, amely megkülönbözteti egy egyszerű szövegtől. Ezzel hozhatunk létre kapcsolatokat, amely az egész webre jellemző. Az adott elemhez többféle dolgot is hozzákapcsolhatunk, például egy másik oldalt, vagy egy bekezdést az adott oldalon, fájlokat, stb. A hivatkozást <a ...> jelölővel hozhatjuk létre, de ebben a formában nem használjuk, mert mindenképpen adnunk kell neki egy href attribútumot, amelyben megadjuk, hogy hová mutasson a hivatkozás. A jelölő a hivatkozás szövegét határolja. A hivatkozás alapértelmezésben kék színű aláhúzott szöveg, amelyre ha rákattintunk akkor elérjük a kapcsolatot. <a href="http://www.w3c.org">A W3C weboldala</a>

  4. Listák készítése

  5. Listák készítése

  6. Egymásba ágyazott lista

  7. Rendhagyó rendezett listák 1.kezdőszám megadása

  8. Rendhagyó rendezett listák 2.sorszám értékének megadása

  9. Rendhagyó rendezett listák 3.visszafelé számozott lista MozzilaFirefox 15.0.1.-ben nem működik!GoogleChrome 25.01364.97m

  10. Meghatározás-listaegy fogalomhoz - egy meghatározás

  11. Meghatározás-listaegy szóhoz több meghatározás, több szóhoz egy meghatározás

  12. Táblázatok készítése

  13. A fejlécek jelölése fontos Forrás: Akadálymentes weboldalak készítése (Pataki Máté)

  14. A táblázatok jelölői

  15. Feladat:

  16. Megoldás: …

  17. Cellák egyesítése <tableborder="1" cellspacing="0" cellpadding="10" align="center"> <caption>Böngészők statisztikája 2011. első negyedévben</caption> <tr> <th>&nbsp;</th> <th colspan="3" bgcolor="#5e5e5e">negyedév</th> </tr> <tr> <th bgcolor="#bbbbbb">hónap</th> <th bgcolor="#bbbbbb">január</th> <th bgcolor="#bbbbbb">február</th> <th bgcolor="#bbbbbb">március</th> </tr> <tr> <th bgcolor="#bbbbbb">Firefox 3.6</th> <td>42.89 %</td> <td>43.41 %</td> <td>42.17 %</td> </tr> <tr> <th bgcolor="#bbbbbb">Internet Explorer 8</th> <td>19.05 %</td> <td>19.18 %</td> <td>18.75 %</td> </tr> <tr> <th bgcolor="#bbbbbb">Chrome 8/9</th> <td>13.16 %</td> <td>13.87 %</td> <td>14.93 %</td> </tr> <tr> <th bgcolor="#bbbbbb">Internet Explorer 7</th> <td>7.59 %</td> <td>7.54 %</td> <td>7.21 %</td> </tr> </table>

  18. Áttekinthetőség érdkében: • Nagyméretű táblázatoknál elősegíti az áttekinthetőséget a következő három jelölőelem-pár: • thead = tablehead = táblázatfej (ez nem egyenlő a táblázat címmel)tbody = table body = táblázattörzstfoot = tablefoot = táblázat lábléc

  19. Feladatok: 20-as zenei toplista készítése: 20. Röyksopp 19. MassiveAttack 18. Pearl Jam 17. Primus 16. RHCP 15. U2 14. Pink Floyd 13. Kosheen …

More Related