Differences

This shows you the differences between two versions of the page.

Link to this comparison view

webbutv_13 [2017-09-01 14:54]
 webbutv_13 [2022-07-18 13:20] (current)
Line 1: Line 1:
 +====== Infoga JavaScript – övning 3 ======
 +
 +I denna uppgift ska du infoga ett färdigt JavaScript på din sida. Du ska sedan använda css för att formatera den multiplikationstabell som scriptet genererar. \\ \\
 +{{:script3.zip|Här hittar du filerna}}.
 +
 +
 +===== Förändra HTML-koden =====
 +
 +  * Använd en //script//-tagg för att länka in JavaScriptfilen //script3.js//.
 +  * Länka även in en css-fil med namnet //script3.css//. Denna fil ska du skapa själv.
 +  * I övrigt får du inte göra några förändringar i HTML-koden.
 +
 +===== Formatera sidan med css =====
 +
 +Följande ska formateringar ska göras i //script3.css//:
 +  * Sätt en //ram// runt formuläret.
 +  * Sätt en yttre //ram// runt hela tabellen. I övrigt skall tabellen inte innehålla några ramar.
 +  * I tabellen ska varannan rad ha //bakgrundsfärgen// //#F3F5DA// och varannan ha //#F5E5DA//.
 +  * I de två kolumnerna med siffror som multipliceras ihop ska //teckenfärgen// vara //#57FC44//.
 +  * I kolumnerna med gångertecken och likamed ska //teckenfärgen// vara //#4488FC//.
 +  * I kolumnen med svaren ska //teckenfärgen// vara //#FC4466//.
 +  * När man håller muspekaren över en rad i tabellen ska bakgrundsfärgen för raden ändras till //#BCF7F7//.
 +  * Gör formateringar så att sidan ser bra ut i övrigt, t.ex. //margin// och //padding//.
 +  * **För högre betyg:** Formatera //input// av typen //text// utan att använda dig av id:et på taggarna. Bakgrundsfärgen skall vara i en gul ton.
 +  * **För högre betyg:** Formatera //input// av typen //button// utan att använda dig av id:et på taggarna. Bakgrundsfärgen skall vara i en blå ton. 
 +===== Tips =====
 +
 +Använd //inspect element// i din webbläsare.
 +
 +===== Redovisning =====
 +
 +Skicka in din css-fil, //script3.css//.