Skip to content

Instantly share code, notes, and snippets.

@zocom-christoffer-wallenberg
Last active August 31, 2020 13:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zocom-christoffer-wallenberg/16a491beedcf4bff80136a7ae13f0a68 to your computer and use it in GitHub Desktop.
Save zocom-christoffer-wallenberg/16a491beedcf4bff80136a7ae13f0a68 to your computer and use it in GitHub Desktop.
CSS - Intro
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<header class="wrapper">
<nav class="menu">
<a href="#" class="menu-link">Hem</a>
<a href="#" class="menu-link">Om mig</a>
</nav>
</header>
<main class="main-wrapper">
<article>
<section>
<h1>Vad är det?</h1>
<p>Lorem Ipsum är en utfyllnadstext från tryck- och förlagsindustrin. Lorem ipsum har varit standard
ända sedan 1500-talet, när en okänd boksättare tog att antal bokstäver och blandade dem för att göra
ett provexemplar av en bok. Lorem ipsum har inte bara överlevt fem århundraden, utan även övergången
till elektronisk typografi utan större förändringar.
Det blev allmänt känt på 1960-talet i samband med lanseringen av Letraset-ark med avsnitt av Lorem
Ipsum, och senare med mjukvaror som Aldus PageMaker.</p>
</section>
<section>
<h1>Var kommer det ifrån?</h1>
<p>I motsättning till vad många tror, är inte Lorem Ipsum slumpvisa ord. Det har sina rötter i ett
stycke klassiskt litteratur på latin från 45 år före år 0, och är alltså över 2000 år gammalt.
Richard McClintock, en professor i latin på Hampden-Sydney College i Virginia, översatte ett av de
mer ovanliga orden, consectetur, från ett stycke Lorem Ipsum och fann dess ursprung genom att
studera användningen av dessa ord i klassisk litteratur.
Lorem Ipsum kommer från styckena 1.10.32 och 1.10.33 av "de Finibus Bonorum et Malorum"
(Ytterligheterna av ont och gott) av Cicero, skriven 45 före år 0. Boken är en avhandling i teorier
om etik, och var väldigt populär under renäsanssen. Den inledande meningen i Lorem Ipsum, "Lorem
Ipsum dolor sit amet...", kommer från stycke 1.10.32.</p>
<p>Den ursprungliga Lorem Ipsum-texten från 1500-talet är återgiven nedan för de intresserade. Styckena
1.10.32 och 1.10.33 från "de Finibus Bonorum et Malorum" av Cicero hittar du också i deras originala
form, åtföljda av de engelska översättningarna av H. Rackham från 1914.</p>
</section>
<section>
<h1>Varför använder vi det?</h1>
<p>Det är ett välkänt faktum att läsare distraheras av läsbar text på en sida när man skall studera
layouten. Poängen med Lorem Ipsum är att det ger ett normalt ordflöde, till skillnad från "Text här,
Text här", och ger intryck av att vara läsbar text.
Många publiseringprogram och webbutvecklare använder Lorem Ipsum som test-text, och en sökning efter
"Lorem Ipsum" avslöjar många webbsidor under utveckling. Olika versioner har dykt upp under åren,
ibland av olyckshändelse, ibland med flit (mer eller mindre humoristiska).</p>
</section>
</article>
</main>
</body>
</html>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.wrapper {
width: 100%;
height: 50px;
background-color: #9933ff;
}
.menu {
text-align: center;
padding-top: 15px;
}
.menu-link {
color: #ffffff;
text-decoration: none;
padding: 10px;
}
.main-wrapper {
max-width: 800px;
margin-left: auto;
margin-right: auto;
margin-top: 0px;
}
h1 {
margin-top: 10px;
margin-bottom: 10px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment