Java web programozás 2.
Tartalom HTML folytatás. A CSS technika Táblázat Listák Űrlap A CSS A CSS lépcsős használata A szintakszis 2009
HTML táblázat <table> … </table>: A táblázat elem. <tr> … </tr> : A táblázat egy sora. <td> … </td> : A táblázat egy cellája. 2009
HTML táblázat <th> … </th>: A táblázat fejléce. <caption> … </caption> : A táblázat címe. 2009
HTML lista <ul> … </ul> : Felsorolás. <ol> … </ol> : Számozott lista. <li> … </li> : Egy listaelem. 2009
HTML űrlap Űrlap („form”) Adatok bekérése, és elküldése a szerver felé. <form action=„xy.jsp”> … </form> : Egy űrlap tag. A „form” tagon belül, különféle beviteli elemek biztosítják az adatbevitelt. Szövegmező <input type=„text” name=„xy”/> 2009
HTML űrlap Rádiógomb <input type=„radio” name=„drink” value=„sor”>Sőr</input> 2009
HTML űrlap Jelölőnégyzet <input type=„checkbox” name=„car”>Autóm van 2009
HTML űrlap Lenyíló lista <select name=„autok”>… </select> <option value=„..”>xy … </select> 2009
HTML űrlap Szövegmező <textarea rows=„8” cols=„20”> Kezdő szöveg </ textarea> 2009
HTML űrlap Az űrlap adatainak az elküldése <input type=„submit” value=„Küldés”> Ekkor a <form> tag, „action” attribútumában megadott szerver oldali kódhoz kerülnek a megadott adatok. GET: Az űrlap adatai, az URL-be kerülnek bele. POST: Az űrlap adatai, a kérés törzsében szerepelnek. 2009
A CSS Mi a CSS? Cascading Style Sheets. Meghatározza, hogyan jelenjenek meg a HTML tag-ek. Általában külön állományban (*.css) vannak a „formázási utasítások”. A CSS segítségével, szétválasztható a „tartalom”, a „megjelenítéstől”! 2009
A CSS nyelvtana szelektor {attribútum: érték} Szelektor („kiválasztó”): Egy HTML tag neve Meghatározza, hogy „MIT” formázunk. Attribútum: A HTML tag, egy jellemzője. Érték: A konkrét változás „értéke”. 2009
Lépcsős használat Az alábbi „sorrendben” érvényesülnek a CSS beállítások: 1. A böngésző alapbeállítása 2. Külső stíluslap. 3. A HEAD tag-ben, definiált „<style>” tag. 4. Soron belüli („in-line”) stílus. 2009
A böngésző alapbeállítása Eszközök Internetbeállítások 2009
A böngésző alapbeállítása Eszközök Internetbeállítások Kisegítő lehetőségek 2009
Külső stíluslap. Egy külön *.css fájlban szerepelnek a formázási utasítások. A <head> tag-ben használjuk. Használata: <link rel="stylesheet" href="basic.css" type="text/css"/> 2009
A <style> tag A <head> elemben szerepel egy <style> tag, amelyben a CSS utasítások kapnak helyet. Pl.: 2009
Soron belüli („in-line”) stílus. Ekkor, a formázni kívánt HTML tag, „style” attribútumát kell beállítani. Pl.: <p style="text-align:right; font-size: 22pt">Ez egy formázott bekezdés.</p> 2009
A CSS használata Elem kiválasztása: Megadjuk azt a típusú elemet, amelyet formázni szeretnénk. Pl. lásd. 18. dia. Több elem kiválasztása: Felsorolás jelleggel. Ekkor csak a felsorolt elemekre lesz érvényes a stílus. 2009
A CSS használata Osztály kiválasztó: Más-más módon lehet megjeleníteni az ugyanolyan tag-eket. A HTML kód: 2009
A CSS használata Azonosító alapú kiválasztás: A HTML elemhez megadjuk az „id” attribútumát. Pl. Megjegyzés használata: /* Ez egy megjegyzés. */ 2009