CSS-egenskapslista: Skillnad mellan sidversioner
PGJ (diskussion | bidrag) |
PGJ (diskussion | bidrag) Ingen redigeringssammanfattning |
||
(93 mellanliggande sidversioner av samma användare visas inte) | |||
Rad 1: | Rad 1: | ||
Här är en lista på de flesta [[CSS-egenskap]]erna. Då [[CSS]] är en ständigt föränderlig standard (eller snarare flera | Här är en lista på de flesta [[CSS-egenskap]]erna. Då [[CSS]] är en ständigt föränderlig standard (eller snarare flera delstandarder), täcker inte denna lista varenda liten egenskap som finns tillgänglig. Dock så bör detta vara ett bra urval. | ||
Det finns även en hel del | <div class="well well-danger"> | ||
Det finns även en hel del CSS-egenskaper som är specifika för olika webbläsare. Generellt sett bör man undvika att använda sig av dessa och hålla sig till de som är standardiserade. Då blir din webbsida mer framtidssäker och mer tillgänglig för dina användare. | |||
</div> | |||
== A == | |||
=== <code>[[align-content]]</code> === | |||
Styr hur innehållet i flexboxar ska läggas ut när det inte får plats på en enda rad. Påverkar enbart om <code>flex-wrap: wrap</code> gäller för flexbehållaren. Se [[flexbox_grunder|flexbox grunder]] och [[avancerad_flexbox|avancerad flexbox]] för mer information. | |||
=== <code>[[align-items]]</code> === | |||
Justerar hur en flexbehållares innehåll placeras ut längs med korsaxeln. Se [[flexbox_grunder|flexbox grunder]] och [[avancerad_flexbox|avancerad flexbox]] för mer information och specifikt [[Mer_flexbox#align-items|detta]]. | |||
=== <code>[[align-self]]</code> === | |||
Styr hur ett individuellt flexföremål ska placeras ut längs med korsaxeln. Används oftast då man vill undanta ett element från det som satts med <code>[[align-items]]</code>. Se [[flexbox_grunder|flexbox grunder]] och [[avancerad_flexbox|avancerad flexbox]] för mer information och specifikt [[Mer_flexbox#align-items|detta]]. | |||
=== <code>[[all]]</code> === | |||
Nollställer alla egenskaper, förutom <code>direction</code> och <code>unicode-bidi</code>. | |||
===<code>animation</code>=== | |||
Samlingsegenskap som används för att sätta de flesta animationsegenskaper samtidigt. | |||
===<code>animation-delay</code>=== | |||
Anger hur lång tid som ska förflyta innan animationen börjar spelas. | |||
== | ===<code>animation-direction</code>=== | ||
Anger om animationen ska spelas baklänges varannan cykel (pingpong-animation). | |||
===<code>animation-duration</code>=== | |||
Anger hur lång tid en animationscykel ska ta. | |||
===<code>animation-fill-mode</code>=== | |||
Anger på vilket sätt de animerade egenskaperna ska sättas på elementet, såväl före som efter animationen körs. | |||
===<code>animation-iteration-count</code>=== | |||
Anger hur många gånger en animation ska spelas upp innan den avslutas helt. | |||
=== <code> | ===<code>animation-name</code>=== | ||
Anger namnet på en animationssekvens. | |||
=== <code> | ===<code>animation-play-state</code>=== | ||
Anger om en animation spelas upp eller om den är stoppad. | |||
=== <code> | ===<code>animation-timing-function</code>=== | ||
Anger vilken tidsfunktion som ska användas när en en animation spelas upp. | |||
== B == | == B == | ||
=== <code>background</code> === | |||
En samlingsegenskap som sätter alla värden som har med bakgrunden att göra. | |||
=== <code>background-attachment</code> === | |||
Anger om en bakgrund ska fixeras eller om den ska skrollas med. | |||
=== <code>background-blend-mode</code> === | |||
Anger hur utritningen av en bakgrund ska mixas med annat material. Fungerar ungefär som Photoshops blendmodes. | |||
=== <code>background-clip</code> === | |||
Anger om bakgrunden ska sträcka sig in under eventuell kantlinje eller ej. | |||
=== <code> [[background-color]] </code> === | === <code> [[background-color]] </code> === | ||
Används för att ändra bakgrundsfärgen på ett element. | Används för att ändra bakgrundsfärgen på ett element. | ||
=== <code>background-image</code> === | |||
Anger en bild som ska användas som bakgrund. | |||
=== <code>background-origin</code> === | |||
Anger var någonstans i en bild som bakgrunden ska hämtas. Används om man vill ha en viss bit ur en större bild. | |||
=== <code>background-position</code> === | |||
Anger var i elementet bakgrunden ska placeras ut. | |||
=== <code>background-repeat</code> === | |||
Anger om en bakgrund ska repeteras eller ej. | |||
=== <code>background-size</code> === | |||
Storleken på eventuell bakgrund. | |||
=== <code> [[border]] </code> === | === <code> [[border]] </code> === | ||
Används för skapa en kantlinje runt ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjer att göra (förutom <code>[[border-radius]]</code>). | Används för skapa en kantlinje runt ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjer att göra (förutom <code>[[border-radius]]</code> och <code>[[border-image]]</code>). | ||
=== <code> [[border-*|border-bottom]] </code> === | |||
Används för skapa en kantlinje på botten av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra. | |||
=== <code> [[border-*-color | border-bottom-color]] </code> === | |||
Används för att sätta linjefärgen på en kantlinje på botten av ett element. | |||
=== <code> [[border-*-*-radius|border-bottom-left-radius]] </code> === | |||
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det nedre, vänstra hörnet. | |||
=== <code> [[border-*-*-radius|border-bottom-right-radius]] </code> === | |||
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det nedre, högra hörnet. | |||
=== <code> [[border-*-style|border-bottom-style]] </code> === | |||
Används för att sätta linjetyp på en kantlinje på botten av ett element. | |||
=== <code> [[border-*-width|border-bottom-width]] </code> === | |||
Används för att sätta bredden på en kantlinje på botten av ett element. | |||
=== <code> [[border-collapse]] </code> === | === <code> [[border-collapse]] </code> === | ||
Anger hur kanterna i tabellelement ska falla samman. | |||
=== <code> [[border-color]] </code> === | === <code> [[border-color]] </code> === | ||
Används för att sätta linjefärgen på en eller flera kantlinje på ett element. | |||
=== <code> [[border-image]] </code> === | === <code> [[border-image]] </code> === | ||
En samlingsegenskap som används för att sätta allt som har att göra med grafik i kantlinjer. | |||
=== <code> [[border-image-outset]] </code> === | |||
Anger hur långt utanför kantlinjen som grafiken ska sticka ut. | |||
=== <code> [[border-image-repeat]] </code> === | |||
Anger om grafiken i en kantlinje ska repeteras eller ej. | |||
=== <code> [[border-image-slice]] </code> === | |||
Ange om grafiken för en kantlinje ska använda sig av så kallad nine-slice. | |||
=== <code> [[border-image-source]] </code> === | |||
Anger URL:en som leder till grafiken för en kantlinje. | |||
=== <code> [[border-image-width]] </code> === | |||
Anger bredden på grafiken för en kantlinje. | |||
=== <code> [[border-*|border-left]] </code> === | |||
Används för skapa en kantlinje på vänsterkanten av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra. | |||
=== <code> [[border-*-color | border-left-color]] </code> === | |||
Används för att sätta linjefärgen på en kantlinje på vänstersidan av ett element. | |||
=== <code> [[border-*-style|border-left-style]] </code> === | |||
Används för att sätta linjetyp på en kantlinje på vänstersidan av ett element. | |||
=== <code> [[border-*-width|border-left-width]] </code> === | |||
Används för att sätta bredden på en kantlinje på vänstersidan av ett element. | |||
=== <code> [[border-radius]] </code> === | |||
Används för att sätta skapa rundade hörn på ett element. | |||
=== <code> [[border-*|border-right]] </code> === | |||
Används för skapa en kantlinje på högerkanten av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra. | |||
=== <code> [[border-*-color | border-right-color]] </code> === | |||
Används för att sätta linjefärgen på en kantlinje på högersidan av ett element. | |||
=== <code> [[border-*-style|border-right-style]] </code> === | |||
Används för att sätta linjetyp på en kantlinje på högersidan av ett element. | |||
=== <code> [[border-*-width|border-left-width]] </code> === | |||
Används för att sätta bredden på en kantlinje på högersidan av ett element. | |||
=== <code> [[border-*|border-top]] </code> === | |||
Används för skapa en kantlinje på toppen av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra. | |||
=== <code> [[border-style]] </code> === | |||
Används för att sätta linjetypen på en eller flera kantlinje på ett element. | |||
=== <code> [[border-*-color | border-top-color]] </code> === | |||
Används för att sätta linjefärgen på en kantlinje på toppen av ett element. | |||
=== <code> [[border-*-*-radius|border-top-left-radius]] </code> === | |||
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det övre, vänstra hörnet. | |||
=== <code> [[border-*-*-radius|border-top-right-radius]] </code> === | |||
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det nedre, högra hörnet. | |||
=== <code> [[border-*-style|border-top-style]] </code> === | |||
Används för att sätta linjetyp på en kantlinje på toppen av ett element. | |||
=== <code> [[border-*-width|border-left-width]] </code> === | |||
Används för att sätta bredden på en kantlinje på toppen av ett element. | |||
=== <code> [[border-width]] </code> === | |||
Används för att sätta linjebredden på en eller flera kantlinje på ett element. | |||
=== <code> [[bottom]] </code> === | === <code> [[bottom]] </code> === | ||
Anger var den botten på ett element ska placeras. Hur detta tolkas varierar med vilken typ av <code>[[position]]</code> som angetts för elementet. | Anger var den botten på ett element ska placeras. Hur detta tolkas varierar med vilken typ av <code>[[position]]</code> som angetts för elementet. | ||
=== <code> [[box-shadow]] </code> === | |||
Används för att skapa en, eller flera, skuggor kring en box. | |||
=== <code> [[box-sizing]] </code> === | |||
Väljer vilken [[boxmodellen|boxmodell]] som ska gälla för ett blockelement. | |||
=== <code> [[break-after]] </code> === | |||
Anger om det ska ske en brytning efter ett skapat element. | |||
=== <code> [[break-before]] </code> === | |||
Anger om det ska ske en brytning före ett skapat element. | |||
=== <code> [[break-inside]] </code> === | |||
Anger om det ska ske brytningar ska kontrolleras inuti ett skapat element. | |||
== C == | == C == | ||
=== <code> [[caption-side]] </code> === | |||
Anger var en illustrations bildtext ska placeras. | |||
=== <code> [[clear]] </code> === | |||
Anger om flytande element ska ligga mot varandra eller ej. Se [[Layout]] för mer info. | |||
=== <code> [[clip-path]] </code> === | |||
Klipper ut en del av ett element så det inte visas. Kan användas för att åstadkomma andra former än rent rektangulära regioner. | |||
=== <code> [[color]] </code> === | === <code> [[color]] </code> === | ||
Används för att ändra förgrundsfärgen på ett element. Mestadels är detta för att förändra textfärgen, men även andra egenskaper påverkas... | Används för att ändra förgrundsfärgen på ett element. Mestadels är detta för att förändra textfärgen, men även andra egenskaper påverkas... | ||
=== <code> [[content]] </code> === | |||
Används tillsammans med <code>::before</code> och <code>::after</code> för att lägga till innehåll i dessa. | |||
=== <code> [[counter-increment]] </code> === | |||
Används för att öka en [[CSS-räknare]] med ett angivet värde. | |||
=== <code> [[counter-reset]] </code> === | |||
Används för att nollställa en [[CSS-räknare]]. | |||
=== <code> [[cursor]] </code> === | |||
Anger vilken typ av cursor som ska användas i ett element. | |||
== D == | == D == | ||
===<code>[[direction]]</code>=== | |||
Anger i vilken riktning innehåll ska läggas ut, speciellt gäller detta för text. Vi kan sätta om texten ska ritas ifrån vänster till höger, dvs "vanlig" text eller om den ska ritas ut ifrån höger till vänster, t.ex. om det är arabiska. | |||
===<code>[[display]]</code>=== | |||
Anger vilken layouttyp ett element ska ritas ut med. I de enklaste fallen kan det vara om ett element är ett blockelement eller ett inlineelement. | |||
== E == | == E == | ||
===<code>empty-cells</code>=== | |||
Anger hur tomma celler i en tabell ska hanteras. | |||
== F == | == F == | ||
===<code>[[filter]]</code>=== | |||
Anger ett grafikfilter för ett element. Kan användas för att t.ex. göra innehållet i ett element suddigt. | |||
===<code>[[flex]]</code>=== | |||
En samlingsegenskap för att sätta <code>[[flex-basis]]</code>, <code>[[flex-grow]]</code> och <code>[[flex-shrink]]</code> på en och samma gång. | |||
===<code>[[flex-basis]]</code>=== | |||
Anger startstorleken på ett flexelement. Se [[Flexbox - sätta storlek]] för mer info. | |||
===<code>[[flex-direction]]</code>=== | |||
Anger i vilken riktning flexaxeln ska gå. Se [[Flexbox - sätta riktning]] för mer info. | |||
===<code>[[flex-flow]]</code>=== | |||
En samlingsegenskap för att sätta <code>[[flex-direction]]</code> och <code>[[flex-wrap]]</code> på en och samma gång. | |||
===<code>[[flex-grow]]</code>=== | |||
Anger hur mycket ett flexelement ska växa till sig i förhållande till andra flexelement. Se [[Flexbox - sätta storlek]] för mer info. | |||
===<code>[[flex-shrink]]</code>=== | |||
Anger hur mycket ett flexelement ska krympa i förhållande till andra flexelement. Se [[Flexbox - sätta storlek]] för mer info. | |||
===<code>[[flex-wrap]]</code>=== | |||
Anger hur en flexbehållare ska bete sig när det blir "fullt" på flexaxeln. Ska innehållet delas upp på flera rader/kolumner? Se [[Flexbox - flexbehållare med flera rader]] för mer info. | |||
===<code>[[float]]</code>=== | |||
Anger om ett element ska vara flytande och hur det i så fall ska positioneras. Det traditionella sättet på vilket man skapar layout i CSS. Se [[layout]] för mer info. [[Flexbox grunder|Flexbox]] är ett modernare och bättre sätt på vilket man kan skapa layout. | |||
===<code>[[font]]</code>=== | |||
En samlingsegenskap som kan användas för att sätta många av värdena som har med teckensnitt att göra. | |||
===<code>[[font-family]]</code>=== | |||
Anger vilket teckensnitt som ska användas i ett element. | |||
===<code>[[font-feature-settings]]</code>=== | |||
Används för att styra egenskaper hos OpenType-teckensnitt. | |||
===<code>[[font-kerning]]</code>=== | |||
Anger för att styra hur mellanrummet mellan bokstäver hanteras. | |||
===<code>[[font-language-override]]</code>=== | |||
Används för att hantera tecken som är specifika för speciella språk. | |||
===<code>[[font-size]]</code>=== | |||
Anger vilken storlek som teckensnittet i ett element ska ha. | |||
===<code>[[font-size-adjust]]</code>=== | |||
Anger om storleken på ett teckensnitt ska baseras på dess versaler eller dess gemena (stora/små bokstäver). | |||
===<code>[[font-stretch]]</code>=== | |||
Används för att välja mellan olika typer i ett teckensnitt. | |||
===<code>[[font-style]]</code>=== | |||
Används för att ändra mellan olika teckensnittsstilar, t.ex. kursiv. | |||
===<code>[[font-synthesis]]</code>=== | |||
Kontrollerar hur och om webbläsaren ska "skapa" tecken som saknas i ett teckensnitt. | |||
===<code>[[font-variant]]</code>=== | |||
En samlingsegenskap som används för att ange värden för alla egenskaperna av typen <code>font-variant-*</code>. | |||
===<code>[[font-variant-alternates]]</code>=== | |||
Anger hur alternativa tecken som definerats med <code>@font-feature-values</code> ska hanteras. | |||
===<code>[[font-variant-caps]]</code>=== | |||
Anger hur versala (stora) bokstäver ska hanteras. | |||
===<code>[[font-variant-east-asian]]</code>=== | |||
Anger hur asiatiska tecken ska hanteras. | |||
===<code>[[font-variant-ligatures]]</code>=== | |||
Används för att ange hur sammanbundna tecken, dvs ligaturer, ska hanteras. | |||
===<code>[[font-variant-numeric]]</code>=== | |||
Används för att ange hur tecken för siffror ska hanteras. | |||
===<code>[[font-variant-position]]</code>=== | |||
Anger hur alternativa tecken ska placeras i förhållande till de "vanliga" tecknen. | |||
===<code>[[font-weight]]</code>=== | |||
Anger hur tjockt ett teckensnitt ska återges. | |||
== G == | == G == | ||
== H == | == H == | ||
=== <code>[[height]]</code> === | |||
Används för att ange höjden på ett blockelement. Fungerar lite olika beroende på vilken [[boxmodellen|boxmodell]] man valt. | |||
===<code>hyphens</code>=== | |||
Anger hur "-"-tecknet ska hanteras när ord bryts. | |||
== I == | == I == | ||
===<code>isolation</code>=== | |||
Anger om det ska skapas ett nytt [[stacking context]] för ett element. | |||
== J == | == J == | ||
=== <code>[[justify-content]]</code> === | |||
Justerar hur en flexbehållares innehåll placeras ut längs med flexaxeln. Se [[flexbox_grunder|flexbox grunder]] och [[avancerad_flexbox|avancerad flexbox]] för mer information och specifikt [[Mer_flexbox#justify-content|detta]]. | |||
== K == | == K == | ||
== L == | == L == | ||
=== <code>[[left]]</code> === | === <code>[[left]]</code> === | ||
Anger hur den vänstra hörnet ska placeras på ett positionerat element. | Anger hur den vänstra hörnet ska placeras på ett positionerat element. | ||
Rad 52: | Rad 333: | ||
=== <code>[[line-height]]</code> === | === <code>[[line-height]]</code> === | ||
Anger | Anger höjden på textrader. | ||
=== <code>[[list-style]]</code> === | === <code>[[list-style]]</code> === | ||
Rad 67: | Rad 348: | ||
== M == | == M == | ||
=== <code>[[margin]]</code> === | |||
Anger hur mycket yttermarginal ett element ska ha. Detta är en samlingsegenskap med vilken man kan sätta marginalerna för alla sidor på samma gång. Se även [[boxmodellen]] för mer information. | |||
=== <code>[[margin]]</code> === | === <code>[[margin-*|margin-bottom]]</code> === | ||
Anger yttermarginalen på ett [[ | Anger den nedre yttermarginalen på ett [[element]]. | ||
=== <code>[[margin-*|margin-left]]</code> === | |||
Anger den vänstra yttermarginalen på ett [[element]]. | |||
=== <code>[[margin-*|margin-right]]</code> === | |||
Anger den högra yttermarginalen på ett [[element]]. | |||
=== <code>[[margin- | === <code>[[margin-*|margin-top]]</code> === | ||
Anger den | Anger den övre yttermarginalen på ett [[element]]. | ||
=== <code>[[ | === <code>[[marks]]</code> === | ||
Anger | Anger klippningsmarkeringar på ett dokument. | ||
=== <code>[[ | === <code>[[mask]]</code> === | ||
Anger | Anger att enbart vissa delar av ett element ska visas. | ||
=== <code>[[ | === <code>[[mask-type]]</code> === | ||
Anger | Anger vilken typ av mask en SVG-mask är. | ||
=== <code>[[max-height]]</code> === | === <code>[[max-height]]</code> === | ||
Anger den maximala höjden på ett [[ | Anger den maximala höjden på ett [[element]]. | ||
=== <code>[[max-width]]</code> === | === <code>[[max-width]]</code> === | ||
Anger den maximala bredden på ett [[ | Anger den maximala bredden på ett [[element]]. | ||
=== <code>[[max-zoom]]</code> === | |||
Anger hur mycket användaren maximalt ska kunna zoom in. | |||
=== <code>[[min-height]]</code> === | |||
Anger den minimala höjden på ett [[element]]. | |||
=== <code>[[min-width]]</code> === | |||
Anger den minimala bredden på ett [[element]]. | |||
=== <code>[[min-zoom]]</code> === | |||
Anger vad som är den minsta inzoomning som användaren ska få utföra. | |||
=== <code>[[mix-blend-mode]]</code> === | |||
Anger hur ett element ska blandas med innehållet som ligger under det. Påminner om PhotoShops blendmodes. | |||
== N == | == N == | ||
===<code>[[negative]]</code>=== | |||
Används med [[CSS-räknare]] för bestämma hur negativa tal ska visas. | |||
== O == | == O == | ||
=== <code> [[object-fit]] </code> === | |||
Anger hur ett objekts storlek ska justeras gentemot föräldraelementet. | |||
=== <code> [[object-position]] </code> === | |||
Anger hur ett objekts position ska justeras gentemot föräldraelementet. | |||
=== <code> [[opacity]] </code> === | === <code> [[opacity]] </code> === | ||
Anger hur genomskinligt ett element ska vara. Detta påverkar allt innehåll i elementet. | Anger hur genomskinligt ett element ska vara. Detta påverkar allt innehåll i elementet. | ||
=== <code> [[order]] </code> === | === <code> [[order]] </code> === | ||
Anger i vilken ordning ett "flexibelt" element ska placeras i förhållande till övriga flexibla element. | Anger i vilken ordning ett "flexibelt" element ska placeras i förhållande till övriga flexibla element. | ||
=== <code>[[orientation]]</code>=== | |||
Anger hur ett dokument ska vara orienterat i förhållande till viewport. Används främst för surfplattor/telefoner. | |||
=== <code>[[orphans]]</code>=== | |||
Anger det minimala antalet rader som ska vara kvar i slutet på ett blockelement. Används främst för att styra sidbrytningar. | |||
=== <code> [[outline]] </code> === | === <code> [[outline]] </code> === | ||
Anger att man vill att det ska ritas en konturlinje kring ett element. Detta påminner om kantlinjer, men är till för att dra uppmärksamheten till sig och visa att något är speciellt med elementet. Detta är en samlingsegenskap där alla outline-egenskaper går att sätta samtidigt. | Anger att man vill att det ska ritas en konturlinje kring ett element. Detta påminner om kantlinjer, men är till för att dra uppmärksamheten till sig och visa att något är speciellt med elementet. Detta är en samlingsegenskap där alla outline-egenskaper går att sätta samtidigt. | ||
Rad 104: | Rad 427: | ||
Anger med vilken linjetyp konturlinjen ska ritas, t.ex. streckad eller heldragen. | Anger med vilken linjetyp konturlinjen ska ritas, t.ex. streckad eller heldragen. | ||
=== <code> [[outline-width]] </code> === | === <code> [[outline-width]] </code> === | ||
Anger bredden på konturlinjen. | |||
=== <code> [[overflow]] </code> === | === <code> [[overflow]] </code> === | ||
Anger vad som ska hända om innehållet i elementet flödar över/hamnar utanför. Om man t.ex. vill få upp en scrollbar eller liknande. Detta är en samlingsegenskap som gäller såväl horisontellt som för vertikalt. | Anger vad som ska hända om innehållet i elementet flödar över/hamnar utanför. Om man t.ex. vill få upp en scrollbar eller liknande. Detta är en samlingsegenskap som gäller såväl horisontellt som för vertikalt. | ||
Rad 114: | Rad 438: | ||
== P == | == P == | ||
=== <code> [[padding]] </code> === | === <code> [[padding]] </code> === | ||
Anger hur mycket utfyllnad ett element ska ha. Detta är en samlingsegenskap med vilken man kan sätta utfyllnaden för alla sidor på samma gång. Se även [[ | Anger hur mycket utfyllnad ett element ska ha. Detta är en samlingsegenskap med vilken man kan sätta utfyllnaden för alla sidor på samma gång. Se även [[boxmodellen]] för mer information. | ||
=== <code> [[padding-*|padding-bottom]] </code> === | |||
Anger hur mycket utfyllnad som ska finnas i botten av ett element. Se även [[boxmodellen]] för mer information. | |||
=== <code> [[padding-*|padding-left]] </code> === | |||
Anger hur mycket utfyllnad som ska finnas på vänstra sidan av ett element. Se även [[boxmodellen]] för mer information. | |||
=== <code> [[padding-*|padding-right]] </code> === | |||
Anger hur mycket utfyllnad som ska finnas på högra sidan av ett element. Se även [[boxmodellen]] för mer information. | |||
=== <code> [[padding-*|padding-top]] </code> === | |||
Anger hur mycket utfyllnad som ska finnas i toppen av ett element. Se även [[boxmodellen]] för mer information. | |||
=== <code> [[page-break-after]] </code> === | === <code> [[page-break-after]] </code> === | ||
Anger om en sidbrytning ska läggas till efter ett element. Elementet kan inte vara tomt eller positionerat. | Anger om en sidbrytning ska läggas till efter ett element. Elementet kan inte vara tomt eller positionerat. | ||
Rad 132: | Rad 460: | ||
=== <code> [[perspective]] </code> === | === <code> [[perspective]] </code> === | ||
Används för att styra perspektivet på 3D-element. | Används för att styra perspektivet på 3D-element. | ||
=== <code> [[position]] </code> === | |||
Används för att styra vilken typ av positionering ett element ska ha. | |||
=== <code> [[perspective-origin]] </code> === | === <code> [[perspective-origin]] </code> === | ||
Används för att styra perspektivet på 3D-element. | Används för att styra perspektivet på 3D-element. | ||
Rad 144: | Rad 474: | ||
=== <code> [[right]] </code> === | === <code> [[right]] </code> === | ||
Anger var den högra kanten på ett element ska placeras. Hur detta tolkas varierar med vilken typ av <code>[[position]]</code> som angetts för elementet. | Anger var den högra kanten på ett element ska placeras. Hur detta tolkas varierar med vilken typ av <code>[[position]]</code> som angetts för elementet. | ||
== S == | |||
== T == | == T == | ||
=== <code> [[table-layout]] </code> === | |||
Anger vilken [[algoritm]] som ska användas för att skapa layouten för en tabell. | |||
=== <code> [[tab-size]] </code> === | === <code> [[tab-size]] </code> === | ||
Anger hur stort utrymme ett tabb-tecken ska uppta. | Anger hur stort utrymme ett tabb-tecken ska uppta. | ||
=== <code> [[text-align]] </code> === | === <code> [[text-align]] </code> === | ||
Anger hur elementet ska placeras horisontellt i relation till andra element. | Anger hur elementet ska placeras horisontellt i relation till andra element. | ||
Rad 156: | Rad 488: | ||
=== <code> [[text-decoration]] </code> === | === <code> [[text-decoration]] </code> === | ||
Används för att sätta olika typer av textstilar, såsom t.ex. understrykning. Detta är en samlingsegenskap som kan användas för att sätta alla text-decoration-egenskaperna på en gång. | Används för att sätta olika typer av textstilar, såsom t.ex. understrykning. Detta är en samlingsegenskap som kan användas för att sätta alla text-decoration-egenskaperna på en gång. | ||
=== <code> [[text-decoration-color]] </code> === | === <code> [[text-decoration-color]] </code> === | ||
Anger färg på understrykningar och liknande textutsmyckningar. | Anger färg på understrykningar och liknande textutsmyckningar. | ||
Rad 175: | Rad 506: | ||
=== <code> [[top]] </code> === | === <code> [[top]] </code> === | ||
Anger var den toppen på ett element ska placeras. Hur detta tolkas varierar med vilken typ av <code>[[position]]</code> som angetts för elementet. | Anger var den toppen på ett element ska placeras. Hur detta tolkas varierar med vilken typ av <code>[[position]]</code> som angetts för elementet. | ||
=== <code> [[transform]] </code> === | |||
Anger hur ett objekt ska förflyttas, roteras, skalas osv. | |||
=== <code> [[transform-box]] </code> === | |||
Anger en layoutbox, som tjänar som referenspunkt för en <code>[[transform]]</code>. | |||
=== <code> [[transform-origin]] </code> === | |||
Anger utifrån vilken punkt en <code>[[transform]]</code> ska beräknas, t.ex. om man vill sätta en bestämd rotationspunkt. | |||
=== <code> [[transform-style]] </code> === | |||
Anger om transformationer ska vara 2D eller 3D. | |||
=== <code> [[transition]] </code> === | |||
En samlingsegenskap som används för att sätta allt som har med övergångar att göra. | |||
=== <code> [[transition-delay]] </code> === | |||
Anger hur lång tid det ska ta innan övergången körs igång. | |||
=== <code> [[transition-duration]] </code> === | |||
Anger hur lång tid en övergång ska ta. | |||
=== <code> [[transition-property]] </code> === | |||
Anger vilka egenskaper som ska påverkas av en övergång. | |||
=== <code> [[transition-timing-function]] </code> === | |||
Anger vilken tidsfunktion som ska kontrollera en övergång. | |||
== U == | == U == | ||
=== <code> [[unicode-bidi]] </code> === | === <code> [[unicode-bidi]] </code> === | ||
Anger hur sidan ska hantera text som är skriven i olika riktningar, t.ex. om man blandar arabiska och svenska på samma sida. | Anger hur sidan ska hantera text som är skriven i olika riktningar, t.ex. om man blandar arabiska och svenska på samma sida. | ||
=== <code> [[unicode-range]] </code> === | |||
Anger vilket spann av unicode-tecken som ska laddas ner. | |||
== V == | == V == | ||
=== <code> [[vertical-align]] </code> === | === <code> [[vertical-align]] </code> === | ||
Anger hur ett element ska placeras vertikalt i relation till | Anger hur ett element av typen <code>inline</code> eller <code>table-cell</code> ska placeras vertikalt i relation till dess föräldraelement. | ||
=== <code> [[visibilty]] </code> === | === <code> [[visibilty]] </code> === | ||
Anger om ett element är synligt eller ej. Även om det inte är synligt så tar det upp plats i sidan. | Anger om ett element är synligt eller ej. Även om det inte är synligt så tar det upp plats i sidan. | ||
== W == | == W == | ||
=== <code> [[white-space]] </code> === | |||
Anger hur [[white space]] (dvs, mellanslag, tabs, return osv) ska hanteras i ett element. | |||
=== <code> [[width]] </code> === | === <code> [[width]] </code> === | ||
Används för att ange bredden på ett | Används för att ange bredden på ett blockelement. Fungerar lite olika beroende på vilken [[boxmodellen|boxmodell]] man valt. | ||
=== <code>[[will-change]]</code>=== | |||
Talar om för webbläsaren att ett element antagligen kommer att förändras på något vis, t.ex. animeras eller något liknande. | |||
=== <code> [[word-break]] </code> === | === <code> [[word-break]] </code> === | ||
Anger hur ord ska avstavas när en rad blir för lång. | Anger hur ord ska avstavas när en rad blir för lång. | ||
Rad 193: | Rad 563: | ||
=== <code> [[word-wrap]] </code> === | === <code> [[word-wrap]] </code> === | ||
Anger om ord ska avstavas när en rad blir för lång | Anger om ord ska avstavas när en rad blir för lång | ||
== Z == | == Z == | ||
=== <code> [[z-index]] </code> === | === <code> [[z-index]] </code> === | ||
Styr hur olika element ska överlappa. Förflyttar elementen längs en tänkt Z-axel. | Styr hur olika element ska överlappa. Förflyttar elementen längs en tänkt Z-axel. | ||
=== <code>[[zoom]]</code>=== | |||
Anger default-zoomvärde. |
Nuvarande version från 10 januari 2019 kl. 12.50
Här är en lista på de flesta CSS-egenskaperna. Då CSS är en ständigt föränderlig standard (eller snarare flera delstandarder), täcker inte denna lista varenda liten egenskap som finns tillgänglig. Dock så bör detta vara ett bra urval.
Det finns även en hel del CSS-egenskaper som är specifika för olika webbläsare. Generellt sett bör man undvika att använda sig av dessa och hålla sig till de som är standardiserade. Då blir din webbsida mer framtidssäker och mer tillgänglig för dina användare.
A
align-content
Styr hur innehållet i flexboxar ska läggas ut när det inte får plats på en enda rad. Påverkar enbart om flex-wrap: wrap
gäller för flexbehållaren. Se flexbox grunder och avancerad flexbox för mer information.
align-items
Justerar hur en flexbehållares innehåll placeras ut längs med korsaxeln. Se flexbox grunder och avancerad flexbox för mer information och specifikt detta.
align-self
Styr hur ett individuellt flexföremål ska placeras ut längs med korsaxeln. Används oftast då man vill undanta ett element från det som satts med align-items
. Se flexbox grunder och avancerad flexbox för mer information och specifikt detta.
all
Nollställer alla egenskaper, förutom direction
och unicode-bidi
.
animation
Samlingsegenskap som används för att sätta de flesta animationsegenskaper samtidigt.
animation-delay
Anger hur lång tid som ska förflyta innan animationen börjar spelas.
animation-direction
Anger om animationen ska spelas baklänges varannan cykel (pingpong-animation).
animation-duration
Anger hur lång tid en animationscykel ska ta.
animation-fill-mode
Anger på vilket sätt de animerade egenskaperna ska sättas på elementet, såväl före som efter animationen körs.
animation-iteration-count
Anger hur många gånger en animation ska spelas upp innan den avslutas helt.
animation-name
Anger namnet på en animationssekvens.
animation-play-state
Anger om en animation spelas upp eller om den är stoppad.
animation-timing-function
Anger vilken tidsfunktion som ska användas när en en animation spelas upp.
B
background
En samlingsegenskap som sätter alla värden som har med bakgrunden att göra.
background-attachment
Anger om en bakgrund ska fixeras eller om den ska skrollas med.
background-blend-mode
Anger hur utritningen av en bakgrund ska mixas med annat material. Fungerar ungefär som Photoshops blendmodes.
background-clip
Anger om bakgrunden ska sträcka sig in under eventuell kantlinje eller ej.
background-color
Används för att ändra bakgrundsfärgen på ett element.
background-image
Anger en bild som ska användas som bakgrund.
background-origin
Anger var någonstans i en bild som bakgrunden ska hämtas. Används om man vill ha en viss bit ur en större bild.
background-position
Anger var i elementet bakgrunden ska placeras ut.
background-repeat
Anger om en bakgrund ska repeteras eller ej.
background-size
Storleken på eventuell bakgrund.
border
Används för skapa en kantlinje runt ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjer att göra (förutom border-radius
och border-image
).
border-bottom
Används för skapa en kantlinje på botten av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra.
border-bottom-color
Används för att sätta linjefärgen på en kantlinje på botten av ett element.
border-bottom-left-radius
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det nedre, vänstra hörnet.
border-bottom-right-radius
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det nedre, högra hörnet.
border-bottom-style
Används för att sätta linjetyp på en kantlinje på botten av ett element.
border-bottom-width
Används för att sätta bredden på en kantlinje på botten av ett element.
border-collapse
Anger hur kanterna i tabellelement ska falla samman.
border-color
Används för att sätta linjefärgen på en eller flera kantlinje på ett element.
border-image
En samlingsegenskap som används för att sätta allt som har att göra med grafik i kantlinjer.
border-image-outset
Anger hur långt utanför kantlinjen som grafiken ska sticka ut.
border-image-repeat
Anger om grafiken i en kantlinje ska repeteras eller ej.
border-image-slice
Ange om grafiken för en kantlinje ska använda sig av så kallad nine-slice.
border-image-source
Anger URL:en som leder till grafiken för en kantlinje.
border-image-width
Anger bredden på grafiken för en kantlinje.
border-left
Används för skapa en kantlinje på vänsterkanten av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra.
border-left-color
Används för att sätta linjefärgen på en kantlinje på vänstersidan av ett element.
border-left-style
Används för att sätta linjetyp på en kantlinje på vänstersidan av ett element.
border-left-width
Används för att sätta bredden på en kantlinje på vänstersidan av ett element.
border-radius
Används för att sätta skapa rundade hörn på ett element.
border-right
Används för skapa en kantlinje på högerkanten av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra.
border-right-color
Används för att sätta linjefärgen på en kantlinje på högersidan av ett element.
border-right-style
Används för att sätta linjetyp på en kantlinje på högersidan av ett element.
border-left-width
Används för att sätta bredden på en kantlinje på högersidan av ett element.
border-top
Används för skapa en kantlinje på toppen av ett element. Detta är en samlingsegenskap med vilken man kan ange alla egenskaper som har med kantlinjen att göra.
border-style
Används för att sätta linjetypen på en eller flera kantlinje på ett element.
border-top-color
Används för att sätta linjefärgen på en kantlinje på toppen av ett element.
border-top-left-radius
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det övre, vänstra hörnet.
border-top-right-radius
Används för att sätta skapa ett rundat hörn på ett element, i detta fall det nedre, högra hörnet.
border-top-style
Används för att sätta linjetyp på en kantlinje på toppen av ett element.
border-left-width
Används för att sätta bredden på en kantlinje på toppen av ett element.
border-width
Används för att sätta linjebredden på en eller flera kantlinje på ett element.
bottom
Anger var den botten på ett element ska placeras. Hur detta tolkas varierar med vilken typ av position
som angetts för elementet.
box-shadow
Används för att skapa en, eller flera, skuggor kring en box.
box-sizing
Väljer vilken boxmodell som ska gälla för ett blockelement.
break-after
Anger om det ska ske en brytning efter ett skapat element.
break-before
Anger om det ska ske en brytning före ett skapat element.
break-inside
Anger om det ska ske brytningar ska kontrolleras inuti ett skapat element.
C
Anger var en illustrations bildtext ska placeras.
clear
Anger om flytande element ska ligga mot varandra eller ej. Se Layout för mer info.
clip-path
Klipper ut en del av ett element så det inte visas. Kan användas för att åstadkomma andra former än rent rektangulära regioner.
color
Används för att ändra förgrundsfärgen på ett element. Mestadels är detta för att förändra textfärgen, men även andra egenskaper påverkas...
content
Används tillsammans med ::before
och ::after
för att lägga till innehåll i dessa.
counter-increment
Används för att öka en CSS-räknare med ett angivet värde.
counter-reset
Används för att nollställa en CSS-räknare.
cursor
Anger vilken typ av cursor som ska användas i ett element.
D
direction
Anger i vilken riktning innehåll ska läggas ut, speciellt gäller detta för text. Vi kan sätta om texten ska ritas ifrån vänster till höger, dvs "vanlig" text eller om den ska ritas ut ifrån höger till vänster, t.ex. om det är arabiska.
display
Anger vilken layouttyp ett element ska ritas ut med. I de enklaste fallen kan det vara om ett element är ett blockelement eller ett inlineelement.
E
empty-cells
Anger hur tomma celler i en tabell ska hanteras.
F
filter
Anger ett grafikfilter för ett element. Kan användas för att t.ex. göra innehållet i ett element suddigt.
flex
En samlingsegenskap för att sätta flex-basis
, flex-grow
och flex-shrink
på en och samma gång.
flex-basis
Anger startstorleken på ett flexelement. Se Flexbox - sätta storlek för mer info.
flex-direction
Anger i vilken riktning flexaxeln ska gå. Se Flexbox - sätta riktning för mer info.
flex-flow
En samlingsegenskap för att sätta flex-direction
och flex-wrap
på en och samma gång.
flex-grow
Anger hur mycket ett flexelement ska växa till sig i förhållande till andra flexelement. Se Flexbox - sätta storlek för mer info.
flex-shrink
Anger hur mycket ett flexelement ska krympa i förhållande till andra flexelement. Se Flexbox - sätta storlek för mer info.
flex-wrap
Anger hur en flexbehållare ska bete sig när det blir "fullt" på flexaxeln. Ska innehållet delas upp på flera rader/kolumner? Se Flexbox - flexbehållare med flera rader för mer info.
float
Anger om ett element ska vara flytande och hur det i så fall ska positioneras. Det traditionella sättet på vilket man skapar layout i CSS. Se layout för mer info. Flexbox är ett modernare och bättre sätt på vilket man kan skapa layout.
font
En samlingsegenskap som kan användas för att sätta många av värdena som har med teckensnitt att göra.
font-family
Anger vilket teckensnitt som ska användas i ett element.
font-feature-settings
Används för att styra egenskaper hos OpenType-teckensnitt.
font-kerning
Anger för att styra hur mellanrummet mellan bokstäver hanteras.
font-language-override
Används för att hantera tecken som är specifika för speciella språk.
font-size
Anger vilken storlek som teckensnittet i ett element ska ha.
font-size-adjust
Anger om storleken på ett teckensnitt ska baseras på dess versaler eller dess gemena (stora/små bokstäver).
font-stretch
Används för att välja mellan olika typer i ett teckensnitt.
font-style
Används för att ändra mellan olika teckensnittsstilar, t.ex. kursiv.
font-synthesis
Kontrollerar hur och om webbläsaren ska "skapa" tecken som saknas i ett teckensnitt.
font-variant
En samlingsegenskap som används för att ange värden för alla egenskaperna av typen font-variant-*
.
font-variant-alternates
Anger hur alternativa tecken som definerats med @font-feature-values
ska hanteras.
font-variant-caps
Anger hur versala (stora) bokstäver ska hanteras.
font-variant-east-asian
Anger hur asiatiska tecken ska hanteras.
font-variant-ligatures
Används för att ange hur sammanbundna tecken, dvs ligaturer, ska hanteras.
font-variant-numeric
Används för att ange hur tecken för siffror ska hanteras.
font-variant-position
Anger hur alternativa tecken ska placeras i förhållande till de "vanliga" tecknen.
font-weight
Anger hur tjockt ett teckensnitt ska återges.
G
H
height
Används för att ange höjden på ett blockelement. Fungerar lite olika beroende på vilken boxmodell man valt.
hyphens
Anger hur "-"-tecknet ska hanteras när ord bryts.
I
isolation
Anger om det ska skapas ett nytt stacking context för ett element.
J
justify-content
Justerar hur en flexbehållares innehåll placeras ut längs med flexaxeln. Se flexbox grunder och avancerad flexbox för mer information och specifikt detta.
K
L
left
Anger hur den vänstra hörnet ska placeras på ett positionerat element.
letter-spacing
Anger hur mycket utrymme som ska vara mellan varje bokstav.
line-height
Anger höjden på textrader.
list-style
En samlingsegenskap för list-style-type
, list-style-image
och list-style-position
.
list-style-image
Anger en bild som ska användas för att markera innehållsraderna i en lista.
list-style-position
Anger var innehållsmarkeringen ska placeras i en lista.
list-style-type
Anger hur vilken typ av innehållsmarkering som ska användas i en lista.
M
margin
Anger hur mycket yttermarginal ett element ska ha. Detta är en samlingsegenskap med vilken man kan sätta marginalerna för alla sidor på samma gång. Se även boxmodellen för mer information.
margin-bottom
Anger den nedre yttermarginalen på ett element.
margin-left
Anger den vänstra yttermarginalen på ett element.
margin-right
Anger den högra yttermarginalen på ett element.
margin-top
Anger den övre yttermarginalen på ett element.
marks
Anger klippningsmarkeringar på ett dokument.
mask
Anger att enbart vissa delar av ett element ska visas.
mask-type
Anger vilken typ av mask en SVG-mask är.
max-height
Anger den maximala höjden på ett element.
max-width
Anger den maximala bredden på ett element.
max-zoom
Anger hur mycket användaren maximalt ska kunna zoom in.
min-height
Anger den minimala höjden på ett element.
min-width
Anger den minimala bredden på ett element.
min-zoom
Anger vad som är den minsta inzoomning som användaren ska få utföra.
mix-blend-mode
Anger hur ett element ska blandas med innehållet som ligger under det. Påminner om PhotoShops blendmodes.
N
negative
Används med CSS-räknare för bestämma hur negativa tal ska visas.
O
object-fit
Anger hur ett objekts storlek ska justeras gentemot föräldraelementet.
object-position
Anger hur ett objekts position ska justeras gentemot föräldraelementet.
opacity
Anger hur genomskinligt ett element ska vara. Detta påverkar allt innehåll i elementet.
order
Anger i vilken ordning ett "flexibelt" element ska placeras i förhållande till övriga flexibla element.
orientation
Anger hur ett dokument ska vara orienterat i förhållande till viewport. Används främst för surfplattor/telefoner.
orphans
Anger det minimala antalet rader som ska vara kvar i slutet på ett blockelement. Används främst för att styra sidbrytningar.
outline
Anger att man vill att det ska ritas en konturlinje kring ett element. Detta påminner om kantlinjer, men är till för att dra uppmärksamheten till sig och visa att något är speciellt med elementet. Detta är en samlingsegenskap där alla outline-egenskaper går att sätta samtidigt.
outline-color
Anger färgen på konturlinjen kring ett element.
outline-offset
Anger hur långt ifrån elementet konturlinjen ska ritas.
outline-style
Anger med vilken linjetyp konturlinjen ska ritas, t.ex. streckad eller heldragen.
outline-width
Anger bredden på konturlinjen.
overflow
Anger vad som ska hända om innehållet i elementet flödar över/hamnar utanför. Om man t.ex. vill få upp en scrollbar eller liknande. Detta är en samlingsegenskap som gäller såväl horisontellt som för vertikalt.
overflow-x
Anger vad som ska hända om innehållet i elementet flödar över/hamnar utanför i X-led. Om man t.ex. vill få upp en scrollbar eller liknande.
overflow-y
Anger vad som ska hända om innehållet i elementet flödar över/hamnar utanför i Y-led. Om man t.ex. vill få upp en scrollbar eller liknande.
P
padding
Anger hur mycket utfyllnad ett element ska ha. Detta är en samlingsegenskap med vilken man kan sätta utfyllnaden för alla sidor på samma gång. Se även boxmodellen för mer information.
padding-bottom
Anger hur mycket utfyllnad som ska finnas i botten av ett element. Se även boxmodellen för mer information.
padding-left
Anger hur mycket utfyllnad som ska finnas på vänstra sidan av ett element. Se även boxmodellen för mer information.
padding-right
Anger hur mycket utfyllnad som ska finnas på högra sidan av ett element. Se även boxmodellen för mer information.
padding-top
Anger hur mycket utfyllnad som ska finnas i toppen av ett element. Se även boxmodellen för mer information.
page-break-after
Anger om en sidbrytning ska läggas till efter ett element. Elementet kan inte vara tomt eller positionerat.
page-break-before
Anger om en sidbrytning ska läggas till före ett element. Elementet kan inte vara tomt eller positionerat.
page-break-inside
Anger om en sidbrytning får förekomma inuti ett element. Elementet kan inte vara tomt eller positionerat.
perspective
Används för att styra perspektivet på 3D-element.
position
Används för att styra vilken typ av positionering ett element ska ha.
perspective-origin
Används för att styra perspektivet på 3D-element.
Q
quotes
Anger vilken typ av citationstecken som ska användas för citat.
R
resize
Anger om ett elements storlek ska kunna ändras av användaren.
right
Anger var den högra kanten på ett element ska placeras. Hur detta tolkas varierar med vilken typ av position
som angetts för elementet.
S
T
table-layout
Anger vilken algoritm som ska användas för att skapa layouten för en tabell.
tab-size
Anger hur stort utrymme ett tabb-tecken ska uppta.
text-align
Anger hur elementet ska placeras horisontellt i relation till andra element.
text-align-last
Anger hur den sista textraden i ett elementet ska placeras horisontellt i relation till andra element.
text-decoration
Används för att sätta olika typer av textstilar, såsom t.ex. understrykning. Detta är en samlingsegenskap som kan användas för att sätta alla text-decoration-egenskaperna på en gång.
text-decoration-color
Anger färg på understrykningar och liknande textutsmyckningar.
text-decoration-line
Anger vilken typ av linje som ska läggas till på en text, t.ex. en understrykning.
text-decoration-style
Anger vilken typ av linje som ska läggas till på en text, t.ex. dotted
för en punkt-linje.
text-indent
Anger hur den första textraden i ett stycke ska indenteras.
text-justify
Anger hur ett text stycke ska justeras, t.ex. center-justering eller höger-justering.
text-overflow
Anger hur text som flödar ut ur ett element ska hanteras, t.ex. om den ska klippas av och inte visas.
text-shadow
Anger en, eller flera textskuggor.
text-transform
Anger om en text ska omvandlas så den visas med t.ex. enbart versaler.
top
Anger var den toppen på ett element ska placeras. Hur detta tolkas varierar med vilken typ av position
som angetts för elementet.
transform
Anger hur ett objekt ska förflyttas, roteras, skalas osv.
transform-box
Anger en layoutbox, som tjänar som referenspunkt för en transform
.
transform-origin
Anger utifrån vilken punkt en transform
ska beräknas, t.ex. om man vill sätta en bestämd rotationspunkt.
transform-style
Anger om transformationer ska vara 2D eller 3D.
transition
En samlingsegenskap som används för att sätta allt som har med övergångar att göra.
transition-delay
Anger hur lång tid det ska ta innan övergången körs igång.
transition-duration
Anger hur lång tid en övergång ska ta.
transition-property
Anger vilka egenskaper som ska påverkas av en övergång.
transition-timing-function
Anger vilken tidsfunktion som ska kontrollera en övergång.
U
unicode-bidi
Anger hur sidan ska hantera text som är skriven i olika riktningar, t.ex. om man blandar arabiska och svenska på samma sida.
unicode-range
Anger vilket spann av unicode-tecken som ska laddas ner.
V
vertical-align
Anger hur ett element av typen inline
eller table-cell
ska placeras vertikalt i relation till dess föräldraelement.
visibilty
Anger om ett element är synligt eller ej. Även om det inte är synligt så tar det upp plats i sidan.
W
white-space
Anger hur white space (dvs, mellanslag, tabs, return osv) ska hanteras i ett element.
width
Används för att ange bredden på ett blockelement. Fungerar lite olika beroende på vilken boxmodell man valt.
will-change
Talar om för webbläsaren att ett element antagligen kommer att förändras på något vis, t.ex. animeras eller något liknande.
word-break
Anger hur ord ska avstavas när en rad blir för lång.
word-spacing
Anger storleken på mellanrummet mellan ord.
word-wrap
Anger om ord ska avstavas när en rad blir för lång
Z
z-index
Styr hur olika element ska överlappa. Förflyttar elementen längs en tänkt Z-axel.
zoom
Anger default-zoomvärde.