Inline CSS betyder att man skriver CSS direkt i XHTML-uppmärkningen. En annan benämning på inline CSS är intern CSS.
Inline CSS är mest användbart när du vill justera smådetaljer och inte har tid eller ork att lägga upp deklarationerna i en extern stilmall.
Ett annat exempel på när inline CSS kan även användas är när du vill frångå den externa stilmallen och ge de regler som du sätter upp internt företräde framför de externa deklarationerna.
Inline CSS, exempel
Exempel 1
Det här stycket fungerar som exempel för att visa hur vi kan skriva röd, stor, kursiv text mitt i ett stycke vanlig text. Den här gröna texten är också gjord med intern CSS.
Så här ser XHTML-koden ut för ovanstående:
<p>Det här stycket fungerar som exempel för att visa hur vi kan skriva <span style="color:red; font-style: italic; font-size:16px; foint-weight: bold;">röd, stor, kursiv text</span> mitt i ett stycke vanlig text. <span style="color:green;">Den här gröna texten</span> är också gjord med intern CSS.</p>
Exempel 2
Låt säga att du vill ha en gul bakgrund och fet blå text med en 2px svart ram runt stycket, samt 2px padding enligt nedan.
Exempel med inline CSS
Koden för detta är:
<p style="background-color: #FFCC33; color: #0066CC; font-weight:bold; border:solid 2px; border-color: #000000; padding: 2px"> Exempel med inline CSS </p>
<<< Extern CSS || Embedded CSS >>>
