Differences

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

Link to this comparison view

daniel_02 [2019-08-27 10:58]
Mattias Hamberg 		daniel_02 [2022-07-18 13:20]
Line 1: Line 1:
-====== Genomgång - Introduktion css====== 
  
-[[http://www.w3schools.com/css/css_max-width.asp| Läs mer om width, max-width and margin: auto]]. 
- 
-<code html> 
-<!DOCTYPE html> 
-<html lang="sv"> 
-<head> 
-  <meta charset="utf-8"> 
-  <link rel="stylesheet" href="style.css"> 
-  <title>Exempel 2</title> 
-</head> 
-<body> 
-<!-- Nedan själva sidan, där skall du klista in texten och tagga den med rätt taggar --> 
-  <h1>Testsida</h1> 
-  <a href="http://iw.park.se">Park</a> 
-  Text 
-  <p class="important">Det här är ett stycke. <a href="http://dn.se">DN</a> bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla </p> 
-  Text 
-  
-<!-- Slut på sidan --> 
-</body> 
-</html> 
-</code> 
-<code css> 
-* { 
-  margin: 0; 
-  padding: 0; 
-} 
- 
-body { 
-  font-size: 26px; 
-} 
- 
-h1 { 
-  font-size: 2em; 
-  margin: 10px; 
-  padding: 10px; 
-} 
- 
-p { 
-  font-size: 18px; 
-} 
- 
-p { 
-  font-size: 35px; 
-  font-family: 'Times New Roman', Times, serif; 
-  background-color: #C1DDF5; 
-  color: #fa0; 
-  border: 2px dotted red; 
-  width: 60%; 
-  padding: 10px 30px 50px 70px; 
-  margin: 30px auto; 
-} 
- 
-a, h1 { 
-  border: 1px black solid; 
-} 
- 
-a:hover { 
-   color: #00ff00; 
-} 
- 
-p a { 
- border: none; 
-} 
- 
-p a:hover { 
-   color: #0000ff; 
-} 
- 
-p.important { 
- background-color: #ff0000; 
-} 
- 
-</code>