Nyomtatás

Tamás Ferenc: Weblapkészítés HTML alapokon – 5. rész

14. fejezet: Térképek

Ha egy bonyolultabb képünk van rengeteg utalással és felirattal és/vagy rajzzal, akkor célszerű egy olyan rendszert kialakítani, amelynél egyes részekre kattintva nyitódhat meg egy újabb kapcsolat. Mintaképpen nézzük meg a következő képet és fájlt: (htmlpelda28.html)

<HTML>
<IMG src="/map.gif" usemap="htmlpelda28.html#terkep1">
<MAP name="terkep1">
<area shape="rect" coords="25,12,114,32" href="/minta1.html">
<area shape="rect" coords="25,33,114,47" href="/minta2.html">
<area shape="rect" coords="25,48,119,70" href="/minta3.html">
<area shape="rect" coords="25,71,119,88" href="/minta4.html">
<area shape="circle" coords="200,212,50" href="/minta5.html">
<area shape="poly" coords="20,200,20,250,80,250,140,200,20,200" href="mailto:Ez az e-mail-cím a szpemrobotok elleni védelem alatt áll. Megtekintéséhez engedélyeznie kell a JavaScript használatát.">
</MAP>
</HTML>

(Megjegyzés: a fenti kép a PhotoShop 5.0 és a CorelDraw 9 programokkal készült!)
A dolog lényege, hogy a térképnek és a feldolgozott utalásoknak nem kell azonos fájlban lennie, de lassabb kapcsolatú gépek miatt célszerű azonos fájlba tenni a két anyagot. Az első fontos utasítás az IMG SRC-ben lévő USEMAP paraméter. Itt meg kell adni a térképfeldolgozó fájl, valamint a térkép helyét.

A térkép feldolgozásához kell a <MAP name="térképneve"> tag. A konkrét élőkapcsokat az <area> tag szabályozza. Fontosabb paraméterei:
- shape = rect (téglalap), circle (kör), poly (polygon), default (mindenhol máshol - egyéb helyen)
- coords = koordináták. Téglalap esetén két átellenes saroké, kör esetén a középpont és a sugár, poligon esetén sorban a sarkok (az utolsó legyen azonos az elsővel!).
- href = élőkapocs. Teljes utalás is lehet, nem csak egyszerű file.
- alt = alternatív szöveg.
- target = Megnyitandó file helye (pl.) megosztás esetén.
- title = az egérmutató hatására kiírandó szöveg.
- nohref = ennek a területnek nincsen élőkapcsa.
- hreflang = a cél-URL nyelve. (Csak HTML5.)
- media = megadja a cél-média/eszköz típusát. (Csak HTML5.)
- rel = alternate/author/bookmark/help/license/next/nofollow/…
/noreferrer/prefetch/prev/search/tag : megadja a jelenlegi dokumentum és a cél közötti kapcsolatot. (Csak HTML5.)
24. feladat: Készítsen térképet legalább 4-fajta célponttal!


15. fejezet: Kérdőív a HTML dokumentumokban

Hadd kezdjem ezúttal egy megjegyzéssel: a kérdőívek helyes összeállítása és megfogalmazása a gyakorlattal rendelkezőknek nem túl nehéz, csak időigényes feladat. Én magam is úgy szokta elkészíteni őket, hogy egy weblapszerkesztővel előbb előkészítem a kérdőívet, majd utána kezdem el egy kódszintű szerkesztővel a finomhangolást!
Még valami: a sima HTML-alapú kérdőívek felett elmúlt az idő. Helyette a gyakorlatban DHTML-t, vagy PHP-t vagy valami egyéb technológiát szoktak használni.

Egy weblapon kérdőíveket is közzé tehetünk, amelyek használata első pillantásra nem feltétlenül egyszerű!
A <FORM METHOD="mód" ACTION="mit csináljak vele"> és a </FORM> közötti utasítások határozzák meg az űrlapot.
Az ACTION határozza meg a feldolgozást végző programot. Ez többnyire a kiszolgáló szerverén a /cgi-bin/ könyvtárban van, de lehet E-mailben is elküldeni. Ez utóbbi sokkal egyszerűbb és nem kell hozzá semmilyen feldolgozó-program. Olvasása a legegyszerűbb szövegszerkesztővel (értsd: NotePad/Jegyzettömb) is lehetséges! Ha mindenáron egy feldolgozó-programot kell megcímezni, akkor kiterjesztése többnyire PHP vagy ASP szokott lenni. Vigyázat! Az ilyen programok írása nem feltétlenül egyszerű!
Minta levélküldésre: <ACTION METHOD="mailto:Ez az e-mail-cím a szpemrobotok elleni védelem alatt áll. Megtekintéséhez engedélyeznie kell a JavaScript használatát.">
Minta feldolgozó-programra: <ACTION METHOD="feldolgoz.php">
A METHOD a kitöltött űrlap továbbítási módját határozza meg. Ez lehet GET (Hozzáfűzi az űrlapot az url-hez - időnként túl hosszúra nyúlhat az url!), illetve POST (adatcsomagban - biztonságos!)
Érdemes használni POST adatküldés esetén az ENCTYPE="TEXT/PLAIN" paramétert, mert így tapasztalatom szerint minden levelezőprogram jól megérti a küldött adatokat, még az egyébként igen kényes www.freemail.hu is!
Az <INPUT NAME="név" TYPE="típus" ALIGN="igazítás"> utasítással határozható meg egy kitöltendő űrlapmező.
A NAME természetesen a mezőnév, amely alapján a feldolgozóprogram azonosítja a bevitt adatot. Ez gyakorlatilag szabadon megválasztható, de javasolt a klasszikus DOS szabványait megtartani és nem túl sokat variálni a nevekkel. Tapasztalatom szerint nem minden E-mail-en elküldött űrlap jön át tökéletesen, ha túl sok a magyar elnevezés.
Az ALIGN itt is igazítást jelent. Lehetséges értékei: left, right, center.
Itt is használható a TITLE, mely itt is az egér hatására megjelenő szöveget jelenti. Tapasztalatom szerint bonyolultabb űrlapoknál sok mező rossz kitöltése elkerülhető pár TITLE tag-gel.
A TYPE pedig az adattípus, melyet vár a beviteli mező. Lehetséges típusok:
-    TEXT - szöveg,
-    PASSWORD - jelszó (nem jelenik meg bevitelkor!),
-    HIDDEN - rejtett (ez sem jelenik meg),
-    CHECKBOX - kapcsoló (több is kiválasztható egyszerre),
-    RADIO - kapcsoló (egyszerre csak egyet lehet kiválasztani),
-    RANGE - numerikus adat,
-    FILE - csatolandó fájl,
-    SUBMIT - adattovábbító gomb,
-    RESET - megsemmisítő (inicializáló) gomb,
-    BUTTON - egyéb nyomógomb.
Az <INPUT> utasításban további opciók is szerepelhetnek, a fő opciók értékeitől függően:
-    A VALUE kiegészítő opcióval megadott értéket veszi fel alapértelmezésként a szöveges vagy numerikus beviteli mező. Értékét nem kell megadni.
-    TEXT típusú mező esetén egy további opció, a SIZE="méret" opció határozza meg az ablak szélességét, a MAXLENGTH="érték" pedig a maximális hosszt. Lehetséges paraméter a READONLY, amely nevéből adódóan csak olvashatóvá teszi a file-t.
-    A CHECKBOX és a RADIO típusú mezők további paramétere lehet a CHECKED opció, mely bekapcsolja a kapcsolót - alapértelmezésként.
-    A RANGE típusú mező esetén megadható az a tartomány, melybe a bevitt értéknek bele kell esnie, a MAX="maximum" és a MIN="minimum" további opciókkal.
-    A FILE típusú mezőben megadott fájl az ACCEPT kiegészítő opcióval megadott MIME módon csatolódik az elküldendő kérdőívhez. (Megjegyzés: Egy Browse nyomógombbal támogatott fájlkereső-ablakból lehet a fájlt kiválasztani.)
-    A SUBMIT és a RESET gombokhoz tartozó kiegészítő opció a VALUE="felirat", amely a gombok feliratát jelöli ki. Egyébként a SUBMIT gomb lenyomásának hatására küldi el az űrlapadatokat a kérdőív a feldolgozó programnak, a RESET gomb lenyomása pedig az alapértékekkel tölti fel a beviteli mezőket.
-    A BUTTON gombot nem feltétlenül kell használni, mivel gyakorlatilag semmilyen szerepe nincsen!
-    Hosszabb szöveg bevitelére alkalmas a <TEXTAREA NAME="név" ROWS="magasság" COLS="szélesség" VALUE="szöveg"> és a </TEXTAREA> utasításpár, amely egy beviteli ablakot nyit megadott szélességben és sorban. A VALUE az alapértelmezésként megjelenítendő szöveget adja meg.
-    Egy kérdésre adandó válasz egyszerű - menüből történő - kiválasztását teszi lehetővé a kérdőíven a <SELECT NAME="név" SIZE="sor"> és a  </SELECT> utasításokkal létrehozott kiválasztásos menü, melynek menüpontjait az <OPTION> utasítással adhatjuk meg. Az OPTION fontos paramétere a VALUE="érték", ami a szöveges/karakteres mezőknél igen hasznos lehet. Érdemes használni, de nem szabad egy kérdőíven túl sok választást megadni, mert akkor tapasztalatom szerint az internetes felhasználó nem hajlandó végigcsinálni a kérdőívet.
-    A SIZE opció azt határozza meg, hogy hány sorban jelenjenek meg a SELECT-ben választható menüpontok egy folyamatosan gördíthető menüben. Hiánya esetén, hagyományos legördülő menüből lehet választani. A MULTIPLE opció esetén több menüpont is kijelölhető egyszerre. Az <OPTION SELECTED> formájú utasítás adja meg az alapértelmezett választást!
-    Érdekes paraméterként lehet alkalmazni az ACCESSKEY=gomb-ot, amelynél a böngészőben lehet megadni az űrlapra ugráshoz használt ALT+gomb kombinációt!
-    Használható a DISABLED is, ami az éppen aktuális elem aktív használatát tiltja le.
-    Érdemes elgondolkozni az AUTOCOMPLETE="ON", illetve "OFF" használatán egyes szöveges mezőknél, persze a jelszómezőket kivéve. Nevéből érthetően ez engedélyezi a mező automatikus kitöltését, ha már a felhasználó járt ott!
-    Lehetőségként felmerülhet, hogy alkalomadtán el kell rejteni a fókuszt, magyarul azt a helyet, ahová először írni lehet. (A dolog értelme: a felhasználónak muszáj legalább egyet kattintania az űrlap kitöltése előtt!)
-    Ezt a HIDEFOCUS="true" értékkel tehetjük lehetővé. Alapértelmezésben a fókusz látható, azaz HIDEFOCUS="false".
-    Itt is felhasználható, igény szerint akár elemenként is a LANG="nyelvi_kód". A hazánkban használt legfontosabb nyelvi kódok:
hu = Hungarian/Magyar
en = English/Általános angol
en-us = English - United States /Amerikai angol
de = German - Standard/Általános német
de-at = German - Austria/Osztrák német
ro = Romanian/Román
ru = Russian/Orosz
cz = Czeh/Cseh
További nyelvi kódok ebből az angol nyelvű táblázatból szedhetők ki: htmllang6.html.
Egy apró tanács a komolyabb kérdőívek kitöltése előtt: mindig többszörösen próbáljuk ki a kész kérdőívet. Lehetőleg ne csak a saját gépünkről, hanem minél több helyről. Ha lehetőségünk van rá, akkor érdemes több böngészőben és minél több operációs rendszerben is kipróbálni. A rendszerek közül ne maradjon ki a Linux, illetve az Android sem! Ha saját magunknak ez gondot okoz, akkor kérjük meg ismerőseinket az ellenőrzésre. "Éles" megrendelőívvel SOHA ne kísérletezgessünk, csak az összes próba után!

A következő példa egy nem kifejezetten egyszerű kérdőívet mutat be - a megrendelőlap már nem hatályos! (htmlpelda29.html):

<html>
<head>
    <meta http-equiv="Content-Language" content="hu">
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
    <title>Tamás Ferenc</title>
</head>
<body>
<form method="post" action="MAILTO: Ez az e-mail-cím a szpemrobotok elleni védelem alatt áll. Megtekintéséhez engedélyeznie kell a JavaScript használatát." enctype="text/plain">
  <h1 align="center">Tamás Ferenc</h1>
  <h2 align="center">A számítástechnika alapjai CD-ROM megrendelőlapja</h2>
  <h3 align="center"><span style="background-color: #FF0000">EZ CSAK MINTA, NEM
  MEGRENDELŐLAP!</span></h3>
  <p align="center">&nbsp;</p>
  <div align="center">
    <center>
    <table border="1" width="75%">
      <tr>
        <td width="60%">
        <input type="checkbox" name="Konyv1" value="ON" checked disabled>
        Tamás Ferenc: A számítástechnika alapjai könyv</td>
        <td width="15%" align="right">4.777 KByte</td>
      </tr>
      <tr>
        <td width="60%">
        <input type="checkbox" name="PPT" value="ON" checked disabled>
        Kiváló minőségű bemutató PowerPoint fájlok</td>
        <td width="15%" align="right">300.000 KByte</td>
      </tr>
      <tr>
        <td width="60%">
        <input type="checkbox" name="Free" value="ON">
        Ajánlott ingyenes programok</td>
        <td width="15%" align="right">150.000 KByte</td>
      </tr>
      <tr>
        <td width="75%" colspan="2">
          <p align="center"><b>
          <input type="checkbox" name="Rendel" value="Rendel" checked>
          IGEN, megrendelem a fenti feltételekkel a CD-ROM-ot és
            vállalom a kifizetést az általam választott módon!</b></p>
        </td>
      </tr>
      <tr>
        <td width="60%">Megrendelő neve</td>
        <td width="15%" align="right">
        <input type="text" name="Név" size="40" value="Teljes név"></td>
      </tr>
      <tr>
        <td width="60%">Irányítószám</td>
        <td width="15%" align="right">
        <input type="text" name="Irszam" size="20" value="8000"></td>
      </tr>
      <tr>
        <td width="60%">Város</td>
        <td width="15%" align="right">
        <input type="text" name="Város" size="37" value="Város"></td>
      </tr>
      <tr>
        <td width="60%">Felhasználási terület(ek)</td>
        <td width="15%" align="right"><select size="2" name="MitCsinal" multiple>
            <option selected value="Önálló tanulás">Önálló tanulás</option>
            <option value="Kiscsoportos tanfolyam">Kiscsoportos tanfolyam</option>
            <option value="Általános iskola">Általános iskola</option>
            <option value="Középiskola">Középiskola</option>
            <option value="Felsőoktatás">Felsőoktatás</option>
            <option value="Egyéb">Egyéb</option>
          </select></td>
      </tr>
      <tr>
        <td width="60%">Fizetési mód</td>
        <td width="15%" align="right">
        <input type="radio" value="posta" name="Hogyan" checked>Postai utánvétellel
          <p><input type="radio" value="bank" name="Hogyan">Banki átutalással</td>
      </tr>
      <tr>
        <td width="60%">Megjegyzés</td>
        <td width="15%" align="right">
        <textarea rows="2" name="S1" cols="20"></textarea></td>
      </tr>
      <tr>
        <td width="75%" colspan="2" align="center">A CD-ROM ára <b>2000 Ft + ÁFA</b>,
          valamint <b>300 Ft</b> csomagolási és postaköltség!
          <h3><input type="submit" value="Megrendelem!" name="Előfizetés">
          Mindösszesen: <b><span style="background-color: #FF0000">2800 Ft</span></b>
          <input type="reset" value="Kilépés" name="Kilépés"></h3>
        </td>
      </tr>
    </table>
    </center>
  </div>
</form>
</body>
</html>

Még valami: ne ilyen szintű legyen az Ön első kérdőíve, kedves olvasó!
Csak lassacskán haladjon a pofonegyszerűtől a nehezebb felé!

25. feladat: Készítsen egy kérdőívet, mely egy E-mail címre postázza el a látogató megkérdezett nevét!
26. feladat: Az előző kérdőívet bővítse úgy, hogy egy újabb 4 soros szövegmezőbe lehessen beírni a felhasználó teljes postacímét!

27. feladat: Az előző kérdőívet bővítse úgy, hogy a felhasználótól kérje be a nemét is egy választómezővel (RADIO BUTTON)!
28. feladat: A előző kérdőívet bővítse egy legördülő mezővel, melynek segítségével a felhasználó megadhatja életkorát évtizedekben!


16. fejezet: Egyéb elemek


Természetesen nem csupán annyi eleme van a HTML-nyelvnek, amennyit ez a meglehetősen szűkre szabott könyv felsorol. Éppen ezért az alábbiakban szeretnék nagyon röviden még pár elemet bemutatni.
•    <!-- Megjegyzés --> Ez az az elem, amit alapértelmezésben nem jelenít meg a böngésző.
•    - <!DOCTYPE> Megjegyzésként jelzi, hogy a weblap melyik HTML-szabványt jeleníti meg. Példa:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
•    ACRONYM: mozaikszavak megadása, beszúrása. Pl.: <acronym title="Cascading Style Sheet">CSS</acronym> A HTML5 már nem támogatja!
•    APPLET: Futtatható program helyének beszúrása. Fontosabb paraméterei:
ALIGN = ABSBOTTOM | ABSMIDDLE | BASELINE | BOTTOM | LEFT | MIDDLE | RIGHT | TEXTTOP | TOP  (Igazítás) A HTML5 már nem támogatja!
ALT = szöveg (Helyettesítő szöveg, ha nem sikerül lefuttatni.)
CODE = filenév (A lefordított Java-class neve.)
CODEBASE = url (A bázis-url helye.)
HEIGHT = n (magasság)
HSPACE = n (Az applet vízszintes margója.)
NAME = név (Az applet neve.)
SRC = url (A forrásfile teljes url-je.)
TITLE = cím (A kiírt szöveg, amit az egér felette lebegésekor íródik ki.)
VSPACE = n (Az applet függőleges margója.)
WIDTH = n (szélesség)
•    BASE: A dokumentum báziscímének meghatározása - keretek (FRAME) alkalmazásakor. (BASE url) Paraméterei: HREF=url és TARGET=ablak_név | _blank | _parent | _self | _top
•    BIG: Betűk nagyobb méretben kiíratása.
•    BUTTON: Nyomógomb beszúrása. Használata szinte teljesen azonos a kérdőívekben megismertével. (A HTML5-ben számos új paraméterrel.)
•    CENTER: A nyitó- és zárótag közötti elemet, vagy elemeket középre rendezi. A HTML5 már nem támogatja!
•    COL: Táblázatban oszlop definiálása. A legtöbb paramétert a HTML5 már nem támogatja.
•    COLGROUP: Oszlopok közös csoportjának gyűjtője. A legtöbb paramétert a HTML5 már nem támogatja.
•    DEL: Dokumentumból törölt szöveg kijelölése.
•    DIR: Felsorolásszerű lista készítése. Eleme: LI. A HTML5 már nem támogatja!
•    FIELDSET: Mezőelem beszúrása. Számos új paramétere van a HTML5-ben.
•    INS: A dokumentumhoz hozzáadott mező beszúrása.
•    LABEL: Címkét definiál a kontrolláló elemek számára.
•    LEGEND: Megadja a FIELDSET elemét. Csak ezen belül lehet használni!
•    LISTING: Előre listázott szöveg. Kb. azonos a PRE taggel.
•    MENU: Listák menü-szerű felsorolása. Eleme: LI. Számos új paramétere van a HTML5-ben.
•    NOSCRIPT: A scriptek megjelenítésére képtelen böngészők számára a HTML-kódot tartalmazza.
•    Q: Kiemelt szöveg megjelenítése.
•    S: Keresztülhúzott karakter.
•    SAMP: Idézet.
•    SCRIPT: Egy más nyelven írt script beszúrása.
•    SMALL: Betűk kisebb méretben kiíratása.
•    SPAN: Érvényességi kör definiálása.
•    STRIKE: Keresztülhúzott szöveg kiírási mód. A HTML5 már nem támogatja!
•    TBODY: Táblázat törzsének definiálása. A legtöbb paramétert a HTML5 már nem támogatja.
•    THEAD: Táblázat fejlécének definiálása. A legtöbb paramétert a HTML5 már nem támogatja.

 


17. fejezet: HTML-színkiosztás


A W3schools.com honlapja szerinti kiosztás megtekinthető itt:
https://www.w3schools.com/colors/colors_names.asp

HTML-referencia: Színkiosztás

Az általánosan elfogadott kódokkal és nevekkel.

ALICEBLUE
(#F0F8FF)
ANTIQUEWHITE
(#FAEBD7)
AQUA
(#00FFFF)
AQUAMARINE
(#7FFFD4)
AZURE
(#F0FFFF)
BEIGE
(#F5F5DC)
BISQUE
(#FFE4C4)
BLACK
(#000000)
BLANCHEDALMOND
(#FFEBCD)
BLUE
(#0000FF)
BLUEVIOLET
(#8A2BE2)
BROWN
(#A52A2A)
BURLYWOOD
(#DEB887)
CADETBLUE
(#5F9EA0)
CHARTREUSE
(#7FFF00)
CHOCOLATE
(#D2691E)
CORAL
(#FF7F50)
CORNFLOWER
(#6495ED)
CORNSILK
(#FFF8DC)
CRIMSON
(#DC143C)
CYAN
(#00FFFF)
DARKBLUE
(#00008B)
DARKCYAN
(#008B8B)
DARKGOLDENROD
(#B8860B)
DARKGRAY
(#A9A9A9)
DARKGREEN
(#006400)
DARKKHAKI
(#BDB76B)
DARKMAGENTA
(#8B008B)
DARKOLIVEGREEN
(#556B2F)
DARKORANGE
(#FF8C00)
DARKORCHID
(#9932CC)
DARKRED
(#8B0000)
DARKSALMON
(#E9967A)
DARKSEAGREEN
(#8FBC8B)
DARKSLATEBLUE
(#483D8B)
DARKSLATEGRAY
(#2F4F4F)
DARKTURQUOISE
(#00CED1)
DARKVIOLET
(#9400D3)
DEEPPINK
(#FF1493)
DEEPSKYBLUE
(#00BFFF)
DIMGRAY
(#696969)
DODGERBLUE
(#1E90FF)
FIREBRICK
(#B22222)
FLORALWHITE
(#FFFAF0)
FORESTGREEN
(#228B22)
FUCHIA
(#FF00FF)
GAINSBORO
(#DCDCDC)
GHOSTWHITE
(#F8F8FF)
GOLD
(#FFD700)
GOLDENROD
(#DAA520)
GRAY
(#808080)
GREEN
(#008000)
GREENYELLOW
(#ADFF2F)
HONEYDEW
(#F0FFF0)
HOTPINK
(#FF69B4)
INDIANRED
(#CD5C5C)
INDIGO
(#4B0082)
IVORY
(#FFFFF0)
KHAKI
(#F0E68C)
LAVENDER
(#E6E6FA)
LAVENDERBLUSH
(#FFF0F5)
LAWNGREEN
(#7CFC00)
LEMONCHIFFON
(#FFFACD)
LIGHTBLUE
(#ADD8E6)
LIGHTCORAL
(#F08080)
LIGHTCYAN
(#E0FFFF)
LIGHTGOLDENRODYELLOW
(#FAFAD2)
LIGHTGREEN
(#90EE90)
LIGHTGREY
(#D3D3D3)
LIGHTPINK
(#FFB6C1)
LIGHTSALMON
(#FFA07A)
LIGHTSEAGREEN
(#20B2AA)
LIGHTSKYBLUE
(#87CEFA)
LIGHTSLATEGRAY
(#778899)
LIGHTSTEELBLUE
(#B0C4DE)
LIGHTYELLOW
(#FFFFE0)
LIME
(#00FF00)
LIMEGREEN
(#32CD32)
LINEN
(#FAF0E6)
MAGENTA
(#FF00FF)
MAROON
(#800000)
MEDIUMAQUAMARINE
(#66CDAA)
MEDIUMBLUE
(#0000CD)
MEDIUMORCHID
(#BA55D3)
MEDIUMPURPLE
(#9370DB)
MEDIUMSEAGREEN
(#3CB371)
MEDIUMSLATEBLUE
(#7B68EE)
MEDIUMSPRINGGREEN
(#00FA9A)
MEDIUMTURQUOISE
(#48D1CC)
MEDIUMVIOLETRED
(#C71585)
MIDNIGHTBLUE
(#191970)
MINTCREAM
(#F5FFFA)
MISTYROSE
(#FFE4E1)
MOCCASIN
(#FFE4B5)
NAVAJOWHITE
(#FFDEAD)
NAVY
(#000080)
OLDLACE
(#FDF5E6)
OLIVE
(#808000)
OLIVEDRAB
(#6B8E23)
ORANGE
(#FFA500)
ORANGERED
(#FF4500)
ORCHID
(#DA70D6)
PALEGOLDENROD
(#EEE8AA)
PALEGREEN
(#98FB98)
PALETURQUOISE
(#AFEEEE)
PALEVIOLETRED
(#DB7093)
PAPAYAWHIP
(#FFEFD5)
PEACHPUFF
(#FFDAB9)
PERU
(#CD853F)
PINK
(#FFC0CB)
PLUM
(#DDA0DD)
POWDERBLUE
(#B0E0E6)
PURPLE
(#800080)
RED
(#FF0000)
ROSYBROWN
(#BC8F8F)
ROYALBLUE
(#4169E1)
SADDLEBROWN
(#8B4513)
SALMON
(#FA8072)
SANDYBROWN
(#F4A460)
SEAGREEN
(#2E8B57)
SEASHELL
(#FFF5EE)
SIENNA
(#A0522D)
SILVER
(#C0C0C0)
SKYBLUE
(#87CEEB)
SLATEBLUE
(#6A5ACD)
SLATEGRAY
(#708090)
SNOW
(#FFFAFA)
SPRINGGREEN
(#00FF7F)
STEELBLUE
(#4682B4)
TAN
(#D2B48C)
TEAL
(#008080)
THISTLE
(#D8BFD8)
TOMATO
(#FF6347)
TURQUOISE
(#40E0D0)
VIOLET
(#EE82EE)
WHEAT
(#F5DEB3)
WHITE
(#FFFFFF)
WHITESMOKE
(#F5F5F5)
YELLOW
(#FFFF00)
YELLOWGREEN
(#9ACD32)

A felhasználó által definiált rendszerszínek

ACTIVEBORDER ACTIVECAPTION APPWORKSPACE BACKGROUND
BUTTONFACE BUTTONHIGHLIGHT BUTTONSHADOW BUTTONTEXT
CAPTIONTEXT GRAYTEXT HIGHLIGHT HIGHLIGHTTEXT
INACTIVEBORDER INACTIVECAPTION INACTIVECAPTIONTEXT INFOBACKGROUND
INFOTEXT MENU MENUTEXT SCROLLBAR
THREEDDARKSHADOW THREEDFACE THREEDHIGHLIGHT THREEDLIGHTSHADOW
THREEDSHADOW WINDOW WINDOWFRAME WINDOWTEXT

 


18. fejezet: HTML-karakterek

Jelen fejezet forrása: https://www.w3schools.com/html/html_symbols.asp

 

Fontosabb matematikai karakterek:

 

Karakter

Szám

Azonosító

Leírás

&#8704;

&forall;

minden…

&#8706;

&part;

parciális derivált

&#8707;

&exist;

van egy… (létezik)

&#8709;

&empty;

üres halmaz

&#8712;

&isin;

eleme

&#8713;

&notin;

nem eleme

&#8715;

&ni;

elemként létezik

&#8719;

&prod;

szorzat

&#8721;

&sum;

összeg

 

Teljes matematikai referencia: https://www.w3schools.com/charsets/ref_utf_math.asp

 

(Sokkal bővebb!)

 

 

Fontosabb görög karakterek:

 

Karakter

Szám

Azonosító

Leírás

Α

&#913;

&Alpha;

nagy görög alfa

α

&#945;

&alpha;

kis görög alfa

Β

&#914;

&Beta;

nagy görög béta

β

&#946;

&beta;

kis görög béta

Γ

&#915;

&Gamma;

nagy görög gamma

γ

&#947;

&gamma;

kis görög gamma

Δ

&#916;

&Delta;

nagy görög delta

Ε

&#917;

&Epsilon;

nagy görög epszilon

Ζ

&#918;

&Zeta;

nagy görög zéta

 

Teljes görög referencia: https://www.w3schools.com/charsets/ref_utf_greek.asp

 

(Sokkal bővebb!)

 

 

Egyéb HTML-azonosítók:

 

Karakter

Szám

Azonosító

Leírás

©

&#169;

&copy;

Copyright jel

®

&#174;

&reg;

Registered jel

&#8364;

&euro;

Euró

&#8482;

&trade;

Trademark

&#8592;

&larr;

balra nyíl

&#8593;

&uarr;

felfelé nyíl

&#8594;

&rarr;

jobbra nyíl

&#8595;

&darr;

balra nyíl

 

Teljes pénzügyi referencia: https://www.w3schools.com/charsets/ref_utf_currency.asp

Az összes nyíl referenciája: https://www.w3schools.com/charsets/ref_utf_arrows.asp

Teljes karakter referencia: https://www.w3schools.com/charsets/ref_utf_symbols.asp

 


19. fejezet: Nyelvi kódok

 

 

Jelen fejezet forrása: https://www.w3schools.com/tags/ref_language_codes.asp

 

Az ISO HTML nyelvi kódokat a weblapok helyes megjelenéséért vezette be a W3C, így komoly segítséget nyújt a böngészőknek. A W3C ajánlása alapján érdemes egy elsődleges nyelvi kódot adni minden egyes weblapnak a következőképpen:

 

<html lang="en">
...
</html>

 

A szintaxis az XML nyelvben kicsit megváltozik, így a következő formát javasolt alkalmazni:

 

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
...
</html>

Most pedig következzen a teljes kódtáblázat (angolul):

 

Language

ISO Code

Abkhazian

ab

Afar

aa

Afrikaans

af

Akan

ak

Albanian

sq

Amharic

am

Arabic

ar

Aragonese

an

Armenian

hy

Assamese

as

Avaric

av

Avestan

ae

Aymara

ay

Azerbaijani

az

Bambara

bm

Bashkir

ba

Basque

eu

Belarusian

be

Bengali (Bangla)

bn

Bihari

bh

Bislama

bi

Bosnian

bs

Breton

br

Bulgarian

bg

Burmese

my

Catalan

ca

Chamorro

ch

Chechen

ce

Chichewa, Chewa, Nyanja

ny

Chinese

zh

Chinese (Simplified)

zh-Hans

Chinese (Traditional)

zh-Hant

Chuvash

cv

Cornish

kw

Corsican

co

Cree

cr

Croatian

hr

Czech

cs

Danish

da

Divehi, Dhivehi, Maldivian

dv

Dutch

nl

Dzongkha

dz

English

en

Esperanto

eo

Estonian

et

Ewe

ee

Faroese

fo

Fijian

fj

Finnish

fi

French

fr

Fula, Fulah, Pulaar, Pular

ff

Galician

gl

Gaelic (Scottish)

gd

Gaelic (Manx)

gv

Georgian

ka

German

de

Greek

el

Greenlandic

kl

Guarani

gn

Gujarati

gu

Haitian Creole

ht

Hausa

ha

Hebrew

he

Herero

hz

Hindi

hi

Hiri Motu

ho

Hungarian

hu

Icelandic

is

Ido

io

Igbo

ig

Indonesian

id, in

Interlingua

ia

Interlingue

ie

Inuktitut

iu

Inupiak

ik

Irish

ga

Italian

it

Japanese

ja

Javanese

jv

Kalaallisut, Greenlandic

kl

Kannada

kn

Kanuri

kr

Kashmiri

ks

Kazakh

kk

Khmer

km

Kikuyu

ki

Kinyarwanda (Rwanda)

rw

Kirundi

rn

Kyrgyz

ky

Komi

kv

Kongo

kg

Korean

ko

Kurdish

ku

Kwanyama

kj

Lao

lo

Latin

la

Latvian (Lettish)

lv

Limburgish ( Limburger)

li

Lingala

ln

Lithuanian

lt

Luga-Katanga

lu

Luganda, Ganda

lg

Luxembourgish

lb

Manx

gv

Macedonian

mk

Malagasy

mg

Malay

ms

Malayalam

ml

Maltese

mt

Maori

mi

Marathi

mr

Marshallese

mh

Moldavian

mo

Mongolian

mn

Nauru

na

Navajo

nv

Ndonga

ng

Northern Ndebele

nd

Nepali

ne

Norwegian

no

Norwegian bokmål

nb

Norwegian nynorsk

nn

Nuosu

ii

Occitan

oc

Ojibwe

oj

Old Church Slavonic, Old Bulgarian

cu

Oriya

or

Oromo (Afaan Oromo)

om

Ossetian

os

Pāli

pi

Pashto, Pushto

ps

Persian (Farsi)

fa

Polish

pl

Portuguese

pt

Punjabi (Eastern)

pa

Quechua

qu

Romansh

rm

Romanian

ro

Russian

ru

Sami

se

Samoan

sm

Sango

sg

Sanskrit

sa

Serbian

sr

Serbo-Croatian

sh

Sesotho

st

Setswana

tn

Shona

sn

Sichuan Yi

ii

Sindhi

sd

Sinhalese

si

Siswati

ss

Slovak

sk

Slovenian

sl

Somali

so

Southern Ndebele

nr

Spanish

es

Sundanese

su

Swahili (Kiswahili)

sw

Swati

ss

Swedish

sv

Tagalog

tl

Tahitian

ty

Tajik

tg

Tamil

ta

Tatar

tt

Telugu

te

Thai

th

Tibetan

bo

Tigrinya

ti

Tonga

to

Tsonga

ts

Turkish

tr

Turkmen

tk

Twi

tw

Uyghur

ug

Ukrainian

uk

Urdu

ur

Uzbek

uz

Venda

ve

Vietnamese

vi

Volapük

vo

Wallon

wa

Welsh

cy

Wolof

wo

Western Frisian

fy

Xhosa

xh

Yiddish

yi, ji

Yoruba

yo

Zhuang, Chuang

za

Zulu

zu

 

 

 

Folytatása következik!