In de voorgaande cursus hebben we geleerd hoe we een HTML pagina aan kunnen maken en deze konden bekijken. In deel 2 leren we hoe we de opmaak (de style, CSS, Cascading Style Sheet) van de pagina aan kunnen passen en zullen we de tekstkleur en achtergrondkleur veranderen.
Voor deze cursus gaan we de volgende code gebruiken. Zet deze code in het bestand dat je gebruikt voor de webpagina.
Als je dit script opent in je browser, zie je dat de achtergrondkleur rood is geworden en de tekstkleur wit is. Je ziet in de code dat we style tags aan de head hebben toegevoegd. Deze geven de opmaak aan voor de pagina. Dit is CSS code. De selector body (het gedeelte voor de {), geeft aan dat we de opmaak van de body gaan aanpassen. De body is het gehele document. Alle zichtbare onderdelen van de webpagina staan hier in opgeslagen. Elke regel wordt gescheiden door puntkomma's. Eerst geef je een eigenschap aan die je wilt wijzigen (bijvoorbeeld color) en dan geef je, na de dubbele punt de waarde aan van deze eigenschap. Als je van de body de achtergrondkleur wilt wijzigen, gebruik je de background-color eigenschap. In het voorbeeld is deze op de waarde red (rood) gezet voor de body. De color (tekstkleur) staat op white (wit) en is dus precies hetgeen wat je te zien krijgt.
Nu heb je het een en andere geleerd over CSS. CSS staat altijd tussen style tags en kan zowel in de head als in de body worden aangeduid. Veel plezier met het maken van nieuwe webpagina's en wie weet maakt u wel de volgende Facebook!
Geen opmerkingen:
Een reactie posten