Cascading Style Sheets , så kallade " CSS ", är en webbdesign språk som används för att styra utseendet på webbsidor . CSS-filer skapas separat från webbsidor under designprocessen gör dem mycket flexibla . När en webbsida har inrättats , ändrar en designer bara CSS-filer utan att röra den huvudsakliga HML koden . Sedan den officiella lanseringen av den första CSS- specifikationen , har detta märkspråk genomgått många förändringar och förändringar . CSS3 kommer nu med många fler funktioner och stöd för ett rikt gränssnitt och extrafunktioner . Moduler
Moduler är ett nytt koncept i CSS3 som gör CSS-specifikationen ska delas upp i grupper av funktioner . Denna arkitektur har inneburit att CSS3 kan börja rulla med väldigt få nya funktioner och som det mognar , fler funktioner läggs som moduler , liknande den agila utvecklingsmetoder som används inom mjukvaruutveckling . Detta iterativ och inkrementell utveckling har inneburit att CSS3 är mer flexibelt jämfört med dess föregångare .
Flera bakgrunder
Med CSS , med flera bakgrunder skulle ha krävt användning av ett antal HTML-taggar och taggar div att göra dem på en webbsida . Med CSS3 , gör den nya och förbättrade " background- image " egendom ligger på bilden layouter ovanpå varandra genom att förklara som visas i exempelkod :
Background - image : URL ( pic1.jpg ) , URL ( pic2.jpg , URL ( pic3.jpg ) ,
text Shadowing
specialeffekter i CSS krävs att texten först göras i bilden - redigeringsprogram och sedan kopplas till en webbsida med hjälp av " " tagg . "text shadow " egendom i CSS3 nu använda text funktioner som en suddig text skuggeffekt som ska läggas med en tagg . denna kod visar hur detta är gjort :
Text - shadow : 1px 4px 6px # 33333 ,
tredje värde , " 6px , " styr suddig effekt medan de två första värdena styra riktningen skugga drop
.
opacitet
med CSS , behövde du använda olika hacka att producera opaciteten effekt med CSS3 nya opacitet funktion , är detta nu sker i ett steg som visas av koden . :
# my_id {
Bakgrund : # F11 ;
Opacitet : 1 ;
}
Border Radius
Utvecklare använder några rader kod för att ha rundade hörn utan att behöva använda den äldre CSS metoden att importera nya bibliotek och göra bilder för varje hörn Denna kod visar hur det görs i CSS3 : .
# id {
Höjd : 50px ;
Bredd : 50px
Border : 2px solid # F00 ,
}
Addera