Aangezien HTML je in staat stelt om tekst vet te maken en afbeeldingen toe te voegen, wat hebt je nog meer nodig om webpagina’s te ontwerpen? CSS (Cascading Style Sheets) biedt opmaakdetails voor pagina’s door je browser te vertellen hoe tekst moet worden weergegeven.
Als je koptekstlettertype groter of kleiner wilt dan normaal, gebruikt je CSS. Het is een eenvoudig systeem: maak in je Html-bestand een klasse met al je opmaakinstructies; noem die klasse vervolgens in je CSS-bestand gewoon de gewenste naam en vertel hem welke eigenschappen er gewijzigd moeten worden.
CCS
Achtergrondkleur:
Het begrip achtergrondkleur in CSS stelt de achtergrondkleur ven een element in.
De achtergrond van een element is de totale grootte, inclusief padding en border.
Let op: niet de marge.
“:Active”:
De CSS betekenis ‘’active’’ kun je vergelijken met een knop, je activeert het als je er op klikt.
Algemeen_ type:
Het begrip algemeen_type in CSS is een bepaalde lettertypen die je kan gebruiken.
Background:
Het begrip background in CSS stelt alle achtergrond instellingen in een keer in, zoals kleur, afbeelding, grootte en zo door.
Background-attachment:
Het begrip background-attachment in CSS is het bepalen van de positie van de achtergrondafbeelding, of de afbeelding vast zit binnen de viewport of mee scrolt met het omringende blok.
Background-position:
Het begrip background-position in CSS Bepaalt de beginpositie van een achtergrondafbeelding.
Background-repeat:
Het begrip background-repeat in CSS betekent dat hij bepaald hoe de achtergrondafbeelding wordt herhaald. Je kan een achtergrondafbeelding herhalen langs de horizontale en verticale assen, of helemaal niet het is maar net wat je wilt.
Border:
Het begrip border bij CSS betekend: de rand van het element, de border-width, border-style, en border-color kun je er van aanpassen.
Border-collapse:
Het begrip border-collapse in CSS is het bepalen of de cellen binnen een < table> gedeelde of afzonderlijke randen van elkaar hebben.
Border-spacing:
Het begrip border-spacing in CSS bepaald de randen van de aangrenzende < tabel> cellen. De eigenschappen zijn alleen van toepassing als de border collapse afzonderlijk is.
Border-style:
Het begrip border-style in CSS stelt de lijnstijl in voor alle vier de zijden van de rand van een element.
Border-width:
Het begrip border-width in CSS stelt de breedte van de 4 randen van een element in. Deze eigenschap kan een waarden hebben van 1 tot 4.
Clear:
Het begrip clear in CSS stelt in of een element onder zwevende elementen die eraan voorafgaan moet worden verplaatst. Clear gebruik je op zwevende en niet zwevende elementen.
Collapsing-margins:
Het begrip collapsing-margins in CSS betekent dat boven en onder marge van blokken soms gecombineerd tot een enkele marge waarvan de grootte de grootste is, dan overschrijft die marge de andere, zodat er één marge overblijft.
Color :
Het begrip color in CSS geeft een kleur, ze kunnen ook een transparantiewaarde bevatten die aangeeft hoe de kleur moet samenvallen met zijn achtergrond.
Commentaar:
Het begrip commentaar in CSS betekent dat de tekst binnen de /* */ tekens zijn opmerkingen. Dit staat je toe om notities in CSS te zetten zonder dat er iets gebeurd met de script/codes. Dat is wel handig omdat je dan tekst kan schijven zodat je later nog weet wat het stukje tekst/code precies is.
Voorbeeld hiervan:
body{
front-size: 62.5% /*1em = 10*/ }
Declaratie:
Het begrip declaratie in CSS is een eigenschap en een waarde.
Voorbeeld hiervan:
front-size: 80%
Descante-selector
Het begrip descante-selector in CSS is elke selector met witruimte tussen.
Display:
Het begrip display in CSS bepaalt of een element wordt behandeld als een blok-of inline-element en de lay-out die word gebruikt voor zijn childeren, zoals flow lay-out, raster of flex.
Eenheid:
Het begrip eenheid in bepaalt de grootte van een eigenschap die je kan instellen voor een element of de inhoud daarvan.
Voorbeeld hiervan:
als je de marge van een alinea wilt instellen geef je het een specifieke waarde deze waarde bevat de css eenheid.
Eigenschap:
Het begrip eigenschap declaratie bestaat uit een eigenschap naam en een eigenschap waarde. De naam van de eigenschap komt eerst, dan een dubbele punt, en dan de waarde.
Voorbeeld hiervan:
property-name : property-value
First-letter:
Het begrip first-letter vertegenwoordigt de eerste letter van een element, als het niet wordt voorafgegaan door andere inhoud (zoals afbeeldingen of inline tabellen) op zijn lijn.
Wat doet first-letter precies?
De first-letter selector zorgt ervoor dat de eerste letter op de eerste regel van een element op blokniveau door de browser met de aangegeven stijl wordt weergegeven.
Elementen die je kan gebruiken met first-letter:
Background properties
Margin properties
Padding properties
Border properties
Text-decoration
Vertical-align (aleen als float is ‘geen’)
Text-transform
Line-height
Float
Clear
Het begrip first-line in CSS past stijlen toe op de eerste regel van een block-level element.
let op: dat de lengte van de eerste regel hangt af van velen factoren die meespelen. Zoals de breedte van het element, de breedte van het document, en de lettergrootte van de tekst.
Float:
Met het begrip float kun je de box om je tekst/afbeelding veranderen.
Voorbeeld hiervan:
Als je zegt float links dan gaat de tekst/afbeelding naar de meest linkse kant.
Font-family:
Het begrip font-family Specificeert het lettertypen voor een element. De font-family eigenschap kan meerdere lettertype bevatten als een “fallback” systeem. Dat betekent als de browser het eerste lettertype niet ondersteund dan pakt hij de volgende lettertype.
Font-size:
Het begrip font-size stelt de grootte in van het lettertype in.
Font-style:
Het begrip font-style bepaalt of een lettertypen moet worden opgemaakt met een normaal, cursief of schuin. Je combineert font-style samen met de font-family.
Font-variant:
Het begrip font-variant in CSS kun je de (geselecteerde) tekst veranderen in kleine letters.
Front-weight:
Het begrip front-weight in CSS heb je de optie om letters dikgedrukt te maken, je kan de letters ook wat lighter maken.
Getal:
Het begrip getal in CSS is de syntax van < getal> het is een uitbreiding van < integer>. Met < getal> kun je getallen of getallen met breukcomponent type.
Voorbeeld hiervan:
12 Een ruw < integer> is ook een < getal>
4.01 Positieve breuk
-456.8 Negatieve breuk
0,0 Nul
+0.0 Nul, met een + voor
-0.0 Nul, met een voorloop –
.60 Fractioneel getal zonder voorloopnul
10e3 Wetenschappelijke notatie
-3.4e-2 Gecompliceerde wetenschappelijke notatie
Height:
Het begrip height in CSS zorgt voor de hoogte van een element. Standaard bepaald de eigenschap de hoogte van het inhoudsgebied. Als box-sizing is ingesteld op border-box, dan wordt in plaats daarvan de hoogte van het randgebied bepaald.
Hex & RGB:
Het begrip hex & RGB in CSS is een hexadecimaal triplet is een hexadecimaal getal van zes cijfers en drie bytes dat in HTML, CSS, SVG en andere computerprogramma’s wordt gebruikt om kleuren weer te geven.
De bytes staan voor de rode, groene en blauwe componenten van de kleur. Eén byte vertegenwoordigt een getal in het bereik 00 tot FF (in hexadecimale notatie), of 0 tot 255 in decimale notatie.
“:Hover”:
Het begrip :hover in CSS wordt gebruikt om elementen te stijlen. :hover wordt gebruikt om elementen te selecteren waar gebruikers met hun cursor of muis overheen gaan. Het kan worden gebruikt op alle elementen, niet alleen op links….Dit is typisch wanneer een gebruiker met de muis over het element gaat.
Let op: :hover moet na :link en :visited (als deze aanwezig zijn) komen in de CSS-definitie, om te functioneren!
Id-selector:
Het begrip id-selector in CSS gebruikt het id attribuut van html element om een specifiek elementen te selecteren. Het id is uniek binnen een pagina, dus de id-selector wordt gebruikt om een uniek element te selecteren. Om een element met een specifiek id te selecteren, schrijf je een hash (#) teken, gevolgd door het id van het element.
Ineger:
Het begrip ineger in CSS is een speciaal type van geeft de getallen zowel positief als negatief aan. Ineger bestaat uit één of meer decimale cijfers, 0 tot en met 9, eventueel voorafgegaan door een enkel + of – teken.
Voorbeelden hiervan:
12 Positief geheel getal (zonder voorteken +)
+123 Positief geheel getal (met + voorloopgetal)
-456 Negatief geheel getal 0 Nul
+0 Nul, met een + als eerste cijfer
-0 Nul, met een voorloop –
Kleur (< kleur>):
Het begrip kleur in CSS staat voor een kleur. Een kan ook een alpha-channel transparantiewaarde bevatten, die aangeeft hoe de kleur moet samenvallen met zijn achtergrond.
Letter-spacing:
Het begrip letter-spacing in CSS stelt het gedrag van de horizontale afstand tussen teksttekens in, dit wordt automatisch toegepast tijdens het laden van de tekst.
Line-height:
Het begrip line-height in CSS bepaalt de hoogte van een regelvak. Het wordt vaak gebruikt om de afstand tussen tekstregels in te stellen.
Link:
Het begrip link in CSS is een verbinding van een webpagina naar een andere webpagina. CSS eigenschappen kunnen worden gebruikt om de links op verschillende manieren op te maken.
List-style:
Het begrip list-style in CSS kun je alle lijst stijleigenschappen in een keer in te stellen.
List-style-position:
Het begrip list-style-position in CSS wordt gebruikt om de positie van markeringen van een lijstelement te benadrukken. Het bepaalt of de markeringen binnen of buiten het kader van het element moeten worden geplaatst.
List-style-type
Het begrip list-style-type in CSS stelt de eigenschappen in van schijf tekens of aangepaste teller stijl.
Margin:
is de afstand van de rand van een element tot de rand van het parent element of de rand van een aangrenzend element.
Voorbeeld hiervan:
< P STYLE=”margin: 0pt 30pt”>Van … verschoven
Max-height:
Het begrip max-height in CSS bepaalt de maximale hoogte van een element. Als de inhoud groter is dan de maximale hoogte, dan zal hij overlopen. Maar als de inhoud kleiner is dan de max-height dan is de max-height niet van toepassing.
Min-heigt:
Het begrip min-height in CSS stelt de minimum hoogte van een element in. Dat wilt zeggen dat de min-height voorkomt dat de gebruikte waarde van de min-height eigenschap kleiner word.
Max-width:
Het begrip max-width in CSS stelt de maximale breedte van een element in. Het voorkomt dat de gebruikte waarde van de width eigenschap groter wordt dan de waarde gespecificeerd door max-width.
Min-width:
Het begrip min-width in CSS bepaalt de minimumbreedte van het element. Als de inhoud kleiner is dan de minimum breedte dan zal de minimum breedte toegepast worden. Als de inhoud groter is dan de minimum breedte, is de min-breedte eigenschap niet van toepassing.
Overerving:
Het begrip overerving in CSS betekent dat sommige eigenschappen doorgegeven worden aan de kinderen van het element waaraan stijlregels werden toegekend.
Percentage “< percentage>”:
Het begrip percentage in CSS is een procentuele waarde. Het wordt vaak gebruikt om een grootte te bepalen. Veel verschillende elementen kunnen gebruik maken van percentages, zoals breedte, hoogte, marge en font-grootte.
Pseudo-class:
Het begrip pseudo-class in CSS is een sleutelwoord dat aan een selector wordt toegevoegd, dat een speciale toestand van het geselecteerd element benadrukt.
Voorbeeld hiervan:
:hover kan worden gebruikt om de kleur van een knop te veranderen wanneer de aanwijzer van de gebruiker er met de muis overheen gaat.
Selector:
Het begrip selector in CSS is het eerste deel van een css regel. Het is een patroon van elementen die de browser (google chrome , firefox, ect) vertellen welke HTML elementen geselecteerd moeten worden om de eigenschappen in de waarde van de regel toegepast te krijgen.
Text-align:
Het begrip text-align in CSS bepaalt de horizontale uitlijning van de inhoud binnen een tabel-cel box. Dit werkt ook het zelfde al vertical-align maar dan op de horizontale lijn
Text- decoration:
Het begrip text-decoration in CSS bepaald het uiterlijk van de decoratieve lijnen op de tekst.
Text-transform:
Het begrip text-transform in CSS bepaald hoe de tekst van de element in hoofdletters moet worden weergeven. Tekst-transform kan worden gebruikt om woorden van de tekst allemaal in hoofdletters, allemaal kleine letters of elk woord in hoofdletters te zetten.
Type-selector:
Het begrip type-selector in CSS zorgt er voor dat als je iets zoekt ( een specifiek woord) in het document dat je het dan makkelijk kan vinden.
Url:
beschrijft een locatie van een bron.
Visibility:
Het begrip Visibility in CSS kun je een element tonen of verbergen zonder dat je de opmaak van een document veranderen, het werkt ook bij rijen of kolommen van een < tabel>
“:Visited”:
Het begrip visited in CSS kun je de links zien die de gebruiker heeft bezocht. Om privacy redenen zijn de stijlen die met deze selector kunnen worden gewijzigd zeer beperkt.
Width:
Het begrip width in CSS is de breedte van het inhoudsgebied van het element.
Word-spacing:
Het begrip word-spacing in CSS bepaalt de spatiering tussen de woorden van een tekstblok.
