| Tantárgy:|[[egyetem:webc2:menu|Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] ]]| | Tananyag:|[[egyetem:webc2:css3_1:menu|css3]]| ====== Színátmenetes gombok ====== ===== Feladat ===== A megadott forrás felhasználásával készítsük el a CSS formázást. Használjunk fel CSS3-as elemeket a megjelenítéshez. ===== Specifikáció ===== - Forrás: [[egyetem:webc2:css3_1:f1:nyersforras|css3_1_f1_nyers.htm]] - Elkészítendő megjelenés:\\ {{:egyetem:webc2:css3_1:f1:css3_1_f1_kep.jpg?600|Gombok megjelenítése}} - Ne változtassuk meg a BODY részt, csak a HEAD részt módosítsuk! - Gombok lekerekítése: 5px - Vonalas színátmenet, alulról felfelé áttűnés változtatásával (folyamosan világosodik az áttűnés növelésével) - Gombok háttérszíneke: #B80202, #46c431, #D9CE1C, #23c6de, #3271d9 - Gombok kerete a háttérszínnek megfelelő 1px-es. - Gombok háttérszíne egér ráhelyezésével: #e30606, #44e329, #eee117, #18d8f4, #377ef2 - Gombokon felső sor fehér színű szöveggel, alsó sor fekete színű szöveggel - Befoglaló keret lekerekítése: 10px - 2 db felirat színe: #2E6BA8 ===== Megoldás ===== Az itt megjelenített megoldást lehetőleg csak arra használja, hogy segítséget nyerjen a feladat megfogalmazásának megértésére, de ne használja a program kódját az Ön által elkészítendő program kódjának megírásához! A másolással csak magát csapja be és megfosztja magát a szoftver fejlesztési képességének fejlődésétől! \\ \\ [[http://tptg.hu/egyetem/webc2/css3_1_f1.htm|Megoldás megtekintése]] \\ \\ A forráslistát csak akkor tekintse meg, ha már végrehajtotta önálló munkával az adott feladat kidolgozását. Az itt megtekinthető megoldás csak segítség arra vonatkozólag, hogy milyen egy elkészített megoldás amely lefedi a feladat kiírásban foglaltakat maradéktalanul. Tudjuk, hogy egy kiírt feladat megoldáshoz számtalan formában juthatunk el, így ha az Ön megoldása megfelel a feladat kiírásban megfogalmazottaknak, akkor tökéletesen végrehajtotta a célt! Az, hogy egy kód mennyire optimális az már a fejlesztő tudásától, gyakorlatától és tapasztalatától függ, minél többet gyakorolja a fejlesztést annál inkább optimálisabb kódot fog készíteni. \\ \\ [[egyetem:webc2:css3_1:f1:forrasanyag|Elkészített program forráskódja]]