Typen CSS-kenmerkkeuzes - Semalt-expert
Een HTML-element bestaat uit een klasse, ID en attributen. Een attribuutselector kiest de HTML-elementen met een attribuut of met een attribuutwaarde. Attribuutselectoren bieden een eenvoudige methode voor het toepassen van stijlen op HTML-elementen met een bepaald kenmerk of een bepaalde kenmerkwaarde. Attribuutselectoren worden gedefinieerd door twee vierkante haakjes, die het attribuut omsluiten met de bijbehorende waarde. Toch kunt u er een selector voor elementtype voor plaatsen. De CSS [attribuut] selector past de stijlregels toe op een element als en wanneer het bestaat uit een gegeven eigenschap.
Typen attribuutselectoren
Er zijn verschillende soorten attribuutselectoren die elk voor afzonderlijke gevallen kunnen worden gebruikt:
CSS [attribute | = "value"] Selectorhoogtepunten elementen met een bepaald kenmerk, en het begint met een gedefinieerde waarde.
CSS [attribute ~ = "value"] Selector wordt gebruikt om elementen te vinden met een eigenschapswaarde die een specifiek woord bevat.
CSS [attribute ^ = "value"] Selector vindt elementen met een eigenschapswaarde bedelend met een specifieke waarde. De waarde is niet noodzakelijkerwijs een heel woord.
CSS [attribute $ = "value"] Selector vindt componenten met een attribuutwaarde die eindigt op een gedefinieerde waarde.
Toepassingen van de CSS-attribuutselectoren
Er zijn verschillende manieren waarop de attribuutselector kan worden gebruikt in plaats van de universele, klasse- of ID-selector te gebruiken.
Het meest gebruikelijke gebruik van attribuutselectoren is op ingangen. omvatten de tekstselectoren, selectievakjes, wachtwoordselectoren, bestandselectoren, verborgen selectors, wachtwoordselectoren, radio-selectors, reset-selectors en anderen.
Styling forms
De attribuutselectoren zijn erg handig bij het stylen formulieren zonder klasse of ID.
Stijllinks
Bijvoorbeeld, attribuutselectoren kunnen worden gebruikt om een blogroll te stylen waar u een lijst met links naar sites van vrienden hebt. link is anders gestileerd, de traditionele manier om dit te doen is om een naam toe te kennen die meer markeringen zou vereisen. Toch zou je het n-kind kunnen gebruiken dat vereist dat de orders nooit veranderen. Het gebruik van de attribuutselectoren maakt het zo gemakkelijk sinds er is een attribuut dat u kunt richten.
Grensinvoer
Styling borders-elementen met behulp van het kenmerk CSS border image is een elegante manier om afbeeldingen toe te voegen aan het lichaam. Hiermee kunt u een afbeelding definiëren als de rand van een element. De randafbeelding kan op verschillende manieren worden geschaald, opgesplitst, herhaald om ervoor te zorgen dat deze in het randgebied past. Met het kenmerk grenzenradius kunt u afgeronde hoeken toevoegen zonder afbeeldingen te gebruiken. De eigenschap bepaalt de vorm van de hoek.
Stylingskleuren
Met de CSS-attribuutselectoren kunt u alle elementen met een bepaalde kleurstijl eenvoudig stijlen. U kunt de kleuraanduiding, RGB (), RGBA (), HSL () en HSLA () -notaties gebruiken. De RGBA-kleurwaarden zijn een uitbreiding van het RGB-kleurmodel met een kanaal dat de dekking van een kleur definieert. De parameterwaarde varieert van 1,0 (ondoorzichtig) tot 0,0 (transparant)
Het HSL-kleurenmodel wordt uitgelegd als de (Hue_saturation_Lightness). De tintweergave is in de vorm van een hoek (0-360) of het kleurenwiel. Verzadiging en lichtheid worden gemeten als percentages. 0% verzadiging staat voor schaduw of grijs, terwijl 100 voor volledige kleur staat. 100% lichtheid staat voor wit, terwijl 0% zwart is.
Post a comment