Differences

This shows you the differences between two versions of the page.

--- mattias_01 [2019-08-27 11:18]
Mattias Hamberg created
+++ mattias_01 [2019-08-28 09:39]
Mattias Hamberg
@@ Line 4: / Line 4: @@
 - På [[https://www.w3schools.com/css/default.asp | W3Schools om CSS]] hittar du mycket bra övningar
+==== Koppla din css till en sida ====
+<code html>
+<head>
+    <meta charset="UTF-8">
+    <title>Allmänt om internetutvecklingen</title>
+    <link rel="stylesheet" href="style.css">
+    /* Detta länkar till en fil som heter "style.css" i samma mapp som html-filen */
+</head>
+</code>
 ==== Vanliga egenskaper ====
 <code css>
@@ Line 43: / Line 52: @@
     color: dodgerblue;
 }
+</code>
+==== Olika typer av väljare ====
+<code css>
+* { /* påverkar alla element utan undantag */ }
+li { /* påverkar alla li-element */ }
+.bordered { /* påverkar alla element med klassen "bordered".
+    Du kan skapa vilka klasser du vill och ge dem speciella regler.
+    När du sedan vill använda den anger du klassens namn i class-atributet */ }
+.bordered li { /* påverkar alla li-element som ligger under ett element med klassen "bordered" */ }
+#main-menu { /* påverkar det element som har id:t "main-menu" */ }
+#main-menu li { /* påverkar alla li-element som ligger under elementet med id:t "main-menu" */ }
+li:hover { /* påverkar alla li-element, men bara när man håller muspekaren över det */ }
+[target=_blank] { /* påverkar alla element där attributet "target" är "_blank" */ }
 </code>