Az előadás letöltése folymat van. Kérjük, várjon

Az előadás letöltése folymat van. Kérjük, várjon

CSS MÉDIATÍPUSOK - PÉLDÁK Abonyi-Tóth Andor, ELTE IK v.20130321.

Hasonló előadás


Az előadások a következő témára: "CSS MÉDIATÍPUSOK - PÉLDÁK Abonyi-Tóth Andor, ELTE IK v.20130321."— Előadás másolata:

1 CSS MÉDIATÍPUSOK - PÉLDÁK Abonyi-Tóth Andor, ELTE IK v.20130321

2 2 Médiatípusok Media típusok Média csoportok continuous/ paged visual/audio/ speech/tactile grid/bitmap interactive/ static braillecontinuoustactilegridboth embossedpagedtactilegridstatic handheldboth visual, audio, speech both printpagedvisualbitmapstatic projectionpagedvisualbitmapinteractive screencontinuousvisual, audiobitmapboth speechcontinuousspeechN/Aboth ttycontinuousvisualgridboth tvbothvisual, audiobitmapboth

3 3 Stíluslapra hivatkozás, importálás  Hivatkozás külső stíluslapra, adott médiatípus esetén   Stíluslap médiafüggő importálása  @import url("alap.css") screen;  @import url("nyomtatas.css") print;

4 4 @media szabály használata @media screen { p {font-family:verdana,sans-serif;font-size:14px;} } @media print { p {font-family:times,serif;font-size:10px;} } @media screen,print { p {text-align:justify;} }

5 5 Feltételek megadása  Stíluslap olyan képernyőre, ami színes   @import url(color.css) screen and (color);  Stíluslap megadás, ha a méret legalább 500px   @media (min-width:500px) { … }  Ugyanez 600-900px között:  @media screen and (min-width: 600px) and (max-width: 900px) {…} http://www.w3.org/TR/css3-mediaqueries/

6 6 Feladat Készítsd el ezt az oldalt!

7 7 Feladat  Nyomtatásban Times, serif betűtípussal jelenjen meg az oldal, a menü pedig legyen eltüntetve!  Ha a böngészőablak szélessége kisebb, mint 550px, akkor a két doboz kerüljön egymás alá, ne pedig egymás mellé, és töltsék ki a teljes szélességet!

8 8 Letöltés  A PDF letöltése: http://bit.ly/ZfbM5o

9 9 Vége


Letölteni ppt "CSS MÉDIATÍPUSOK - PÉLDÁK Abonyi-Tóth Andor, ELTE IK v.20130321."
Google Hirdetések