Newest Viewed Downloaded

Cascading Style Sheets

CSS

Cascading Style Sheets

Varför CSS

Lätt att underhålla Mindre filstorlekar Ökad tillgänglighet Olika media Större typografisk kontroll

INTRO TILL CSS

L2

L2

Rubrik nivå 1

Rubrik nivå 2

Lorem ipsum ...

CSS-fil: L2.CSS

L2 h1 { text-align: center; } h2 { font-style: italic; } p { color: maroon;}

Deklarationer

h1 { text-align: center; } h2 { font-style: italic; } p { color: maroon;}

Kommentar, kombinerade selektorer

@charset "utf-8"; h1, h2 { text-align: center; color:#007FFF; /*Färgerna anges som RR GG BB*/ } h2 { font-style: italic; } p { color: maroon; }

Formattera font

h2 { font-style: italic; font-variant: small-caps; font-weight: bold; font-size: 100%; line-height: 120%; font-family:Arial, Helvetica, sans-serif; }

Kantlinjer

h1 { border-width: 1px; border-style: dashed; border-color: red; }

Padding

p { color: maroon; padding-top: 1em; padding-right: 2em; padding-bottom: 3em; padding-left: 4em; border-width: 1px; border-style: solid; border-color: blue; line-height: 130%; }

Margin

p { color: maroon; margin-top: 1em; margin-bottom: 3em; border-width: 1px; border-style: solid; border-color: blue; line-height: 130%; }

STILMALLAR

3 sätt att stila på - L4

In-line-kod

Rubrik 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

(4a)

Rubrikformat

L4

Extern stilmall

@charset "utf-8"; p { font-family:Arial, Helvetica, sans-serif; margin:15px; padding:1em; background-color:gray; width:10em; color:white; } h1 { margin:15px; }

Box-modellen

L5

Box-modellen

Rubrik 1

Lorem ...

#content {margin:10px; border:5px solid gray; background-color:blue; width:200px; padding:25px;} p {font-family:Arial, Helvetica, sans-serif; margin:15px; padding:10px; background-color:gray; margin:20px; border:10px dashed white; background-color:red; width:120px;} h1 {color:white;}

Selektorer

Selektor { egenskap: värde;}

@charset "utf-8"; /* CSS Document */ p {color:black;} p em {color:green;} div p {color:red;} .special{background-color:#999999;

Showing 1 - 20 of 121 items Details

Name: 
css_foersta_intro-2011B
Author: 
Ulf
Company: 
N/A
Description: 
Cascading Style Sheets
Tags: 
div | color | padding | margin | border | background | left | width
Created: 
12/7/2009 5:43:26 PM
Slides: 
121
Views: 
0
Downloads: 
0
Rating: 
0


> Comment



Share this presentation
|

Comments

Share this presentation:

|
Sitemap