SlideShare ist ein Scribd-Unternehmen logo

CSS: Einführung

•
•
L
lehrerfreund
BildungTechnologie
1 von 7
CSS Einführung
(X)HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
CSS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Beispiel: css Zen Garden ,[object Object],Gleicher HTML-Quelltext, unterschiedliche Layouts!
Beispiel: css Zen Garden
Beispiel: css Zen Garden
Beispiel: css Zen Garden ,[object Object],<body id=&quot;css-zen-garden&quot;> <div id=&quot;container&quot;> <div id=&quot;intro&quot;> <div id=&quot;pageHeader&quot;> <h1> <span>css Zen Garden</span> </h1> <h2> <span>The Beauty of <acronym title=&quot;Cascading Style Sheets&quot;>CSS</acronym> Design</span> </h2> </div> <div id=&quot;quickSummary&quot;> <p class=&quot;p1&quot;> <span>A demonstration of what can be accomplished visually through <acronym title=&quot;Cascading Style Sheets&quot;>CSS</acronym> -based design. Select any style sheet from the list to load it into this page.</span> </p> <p class=&quot;p2&quot;><span>Download the sample <a href= &quot;/zengarden-sample.html&quot; title=&quot;This page's source HTML code, not to be modified.&quot;>html file</a> ...

Empfohlen

CSS: Schrift formatieren
CSS: Schrift formatierenCSS: Schrift formatieren
CSS: Schrift formatierenlehrerfreund
 
CSS: Rahmen und Hintergründe
CSS: Rahmen und HintergründeCSS: Rahmen und Hintergründe
CSS: Rahmen und Hintergründelehrerfreund
 
PHP: Objekte erzeugen
PHP: Objekte erzeugenPHP: Objekte erzeugen
PHP: Objekte erzeugenlehrerfreund
 
CSS - Externes Stylesheet
CSS - Externes StylesheetCSS - Externes Stylesheet
CSS - Externes Stylesheetlehrerfreund
 
HTML - Die erste Webseite
HTML - Die erste WebseiteHTML - Die erste Webseite
HTML - Die erste Webseitelehrerfreund
 
CSS: div und span
CSS: div und spanCSS: div und span
CSS: div und spanlehrerfreund
 
CSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-BereichCSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-Bereichlehrerfreund
 
HTML: Listen
HTML: ListenHTML: Listen
HTML: Listenlehrerfreund
 

Empfohlen

CSS: Schrift formatieren
CSS: Schrift formatierenCSS: Schrift formatieren
CSS: Schrift formatierenlehrerfreund
 
CSS: Rahmen und Hintergründe
CSS: Rahmen und HintergründeCSS: Rahmen und Hintergründe
CSS: Rahmen und Hintergründelehrerfreund
 
PHP: Objekte erzeugen
PHP: Objekte erzeugenPHP: Objekte erzeugen
PHP: Objekte erzeugenlehrerfreund
 
CSS - Externes Stylesheet
CSS - Externes StylesheetCSS - Externes Stylesheet
CSS - Externes Stylesheetlehrerfreund
 
HTML - Die erste Webseite
HTML - Die erste WebseiteHTML - Die erste Webseite
HTML - Die erste Webseitelehrerfreund
 
CSS: div und span
CSS: div und spanCSS: div und span
CSS: div und spanlehrerfreund
 
CSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-BereichCSS: Stildeklaration im head-Bereich
CSS: Stildeklaration im head-Bereichlehrerfreund
 
HTML: Listen
HTML: ListenHTML: Listen
HTML: Listenlehrerfreund
 
PHP: Switch
PHP: SwitchPHP: Switch
PHP: Switchlehrerfreund
 
CSS: Links formatieren
CSS: Links formatierenCSS: Links formatieren
CSS: Links formatierenlehrerfreund
 
HTML: Tabellen
HTML: TabellenHTML: Tabellen
HTML: Tabellenlehrerfreund
 
CSS: Zweispaltige Layouts
CSS: Zweispaltige LayoutsCSS: Zweispaltige Layouts
CSS: Zweispaltige Layoutslehrerfreund
 
HTML: Formulare
HTML: FormulareHTML: Formulare
HTML: Formularelehrerfreund
 
Common Good Presentation (short)
Common Good Presentation (short)Common Good Presentation (short)
Common Good Presentation (short)retired
 
PHP: Assoziative Arrays
PHP: Assoziative ArraysPHP: Assoziative Arrays
PHP: Assoziative Arrayslehrerfreund
 
Anti Aging Secrets
Anti Aging Secrets Anti Aging Secrets
Anti Aging Secrets Imtiaz Sharafali
 
Business Presentation
Business PresentationBusiness Presentation
Business PresentationImtiaz Sharafali
 
Femmesgi Jb
Femmesgi JbFemmesgi Jb
Femmesgi JbComune di San Prospero
 
Le Lycée
Le LycéeLe Lycée
Le LycéeComune di San Prospero
 
Village
VillageVillage
VillageComune di San Prospero
 
Burca Rodica
Burca RodicaBurca Rodica
Burca RodicaComune di San Prospero
 
20131211 présentation économie cornouaillaise
20131211 présentation économie cornouaillaise20131211 présentation économie cornouaillaise
20131211 présentation économie cornouaillaiseComune di San Prospero
 
Présentationnégociales dh
Présentationnégociales dhPrésentationnégociales dh
Présentationnégociales dhLPbrabois
 
The building blocks of congregations
The building blocks of congregationsThe building blocks of congregations
The building blocks of congregationsretired
 
PresentacióN
PresentacióNPresentacióN
PresentacióNguesteea0805
 
Pp bourguignon delphine
Pp bourguignon delphinePp bourguignon delphine
Pp bourguignon delphineLPbrabois
 
Les negociales
Les negocialesLes negociales
Les negocialesLPbrabois
 
Masque
MasqueMasque
MasqueJeffreyOwen
 
Dynamische Websites mit XML
Dynamische Websites mit XMLDynamische Websites mit XML
Dynamische Websites mit XMLStephan Schmidt
 
Semantischer xhtml code 12w
Semantischer xhtml code 12wSemantischer xhtml code 12w
Semantischer xhtml code 12wHans Mittendorfer
 

Weitere ähnliche Inhalte

Andere mochten auch

CSS: Links formatieren
CSS: Links formatierenCSS: Links formatieren
CSS: Links formatierenlehrerfreund
 
CSS: Zweispaltige Layouts
CSS: Zweispaltige LayoutsCSS: Zweispaltige Layouts
CSS: Zweispaltige Layoutslehrerfreund
 
Common Good Presentation (short)
Common Good Presentation (short)Common Good Presentation (short)
Common Good Presentation (short)retired
 
PHP: Assoziative Arrays
PHP: Assoziative ArraysPHP: Assoziative Arrays
PHP: Assoziative Arrayslehrerfreund
 
20131211 présentation économie cornouaillaise
20131211 présentation économie cornouaillaise20131211 présentation économie cornouaillaise
20131211 présentation économie cornouaillaiseComune di San Prospero
 
Présentationnégociales dh
Présentationnégociales dhPrésentationnégociales dh
Présentationnégociales dhLPbrabois
 
The building blocks of congregations
The building blocks of congregationsThe building blocks of congregations
The building blocks of congregationsretired
 
Pp bourguignon delphine
Pp bourguignon delphinePp bourguignon delphine
Pp bourguignon delphineLPbrabois
 
Les negociales
Les negocialesLes negociales
Les negocialesLPbrabois
 

Andere mochten auch (20)

PHP: Switch
PHP: SwitchPHP: Switch
PHP: Switch
 
CSS: Links formatieren
CSS: Links formatierenCSS: Links formatieren
CSS: Links formatieren
 
HTML: Tabellen
HTML: TabellenHTML: Tabellen
HTML: Tabellen
 
CSS: Zweispaltige Layouts
CSS: Zweispaltige LayoutsCSS: Zweispaltige Layouts
CSS: Zweispaltige Layouts
 
HTML: Formulare
HTML: FormulareHTML: Formulare
HTML: Formulare
 
Common Good Presentation (short)
Common Good Presentation (short)Common Good Presentation (short)
Common Good Presentation (short)
 
PHP: Assoziative Arrays
PHP: Assoziative ArraysPHP: Assoziative Arrays
PHP: Assoziative Arrays
 
Anti Aging Secrets
Anti Aging Secrets Anti Aging Secrets
Anti Aging Secrets
 
Business Presentation
Business PresentationBusiness Presentation
Business Presentation
 
Femmesgi Jb
Femmesgi JbFemmesgi Jb
Femmesgi Jb
 
Le Lycée
Le LycéeLe Lycée
Le Lycée
 
Village
VillageVillage
Village
 
Burca Rodica
Burca RodicaBurca Rodica
Burca Rodica
 
20131211 présentation économie cornouaillaise
20131211 présentation économie cornouaillaise20131211 présentation économie cornouaillaise
20131211 présentation économie cornouaillaise
 
Présentationnégociales dh
Présentationnégociales dhPrésentationnégociales dh
Présentationnégociales dh
 
The building blocks of congregations
The building blocks of congregationsThe building blocks of congregations
The building blocks of congregations
 
PresentacióN
PresentacióNPresentacióN
PresentacióN
 
Pp bourguignon delphine
Pp bourguignon delphinePp bourguignon delphine
Pp bourguignon delphine
 
Les negociales
Les negocialesLes negociales
Les negociales
 
Masque
MasqueMasque
Masque
 

Ähnlich wie CSS: Einführung

Dynamische Websites mit XML
Dynamische Websites mit XMLDynamische Websites mit XML
Dynamische Websites mit XMLStephan Schmidt
 
Websemantik: Die nächsten Schritte
Websemantik: Die nächsten SchritteWebsemantik: Die nächsten Schritte
Websemantik: Die nächsten SchritteMichael Jendryschik
 
HTML - Hyperlinks erstellen
HTML - Hyperlinks erstellenHTML - Hyperlinks erstellen
HTML - Hyperlinks erstellenlehrerfreund
 
2 - Sprachen Des Semantic Web - XML
2 - Sprachen Des Semantic Web - XML2 - Sprachen Des Semantic Web - XML
2 - Sprachen Des Semantic Web - XMLSteffen Schloenvoigt
 
Datenformate und Standards
Datenformate und StandardsDatenformate und Standards
Datenformate und StandardsJakob .
 
Xhtml Coding (nicht nur für Bibliotheken)
Xhtml Coding (nicht nur für Bibliotheken)Xhtml Coding (nicht nur für Bibliotheken)
Xhtml Coding (nicht nur für Bibliotheken)Luka Peters
 
Fortbildung Schulwebsite: Technische Grundlagen
Fortbildung Schulwebsite: Technische GrundlagenFortbildung Schulwebsite: Technische Grundlagen
Fortbildung Schulwebsite: Technische GrundlagenAndreas Kalt
 
Suchmaschinen-Optimierung
Suchmaschinen-OptimierungSuchmaschinen-Optimierung
Suchmaschinen-OptimierungFH Joanneum
 
Türme bauen mit Schildbürgern (Webtech Edition)
Türme bauen mit Schildbürgern (Webtech Edition)Türme bauen mit Schildbürgern (Webtech Edition)
Türme bauen mit Schildbürgern (Webtech Edition)Nicolai Schwarz
 
Die JSTL Tag-Library
Die JSTL Tag-LibraryDie JSTL Tag-Library
Die JSTL Tag-Librarytutego
 

Ähnlich wie CSS: Einführung (14)

Dynamische Websites mit XML
Dynamische Websites mit XMLDynamische Websites mit XML
Dynamische Websites mit XML
 
Semantischer xhtml code 12w
Semantischer xhtml code 12wSemantischer xhtml code 12w
Semantischer xhtml code 12w
 
Websemantik: Die nächsten Schritte
Websemantik: Die nächsten SchritteWebsemantik: Die nächsten Schritte
Websemantik: Die nächsten Schritte
 
HTML - Hyperlinks erstellen
HTML - Hyperlinks erstellenHTML - Hyperlinks erstellen
HTML - Hyperlinks erstellen
 
2 - Sprachen Des Semantic Web - XML
2 - Sprachen Des Semantic Web - XML2 - Sprachen Des Semantic Web - XML
2 - Sprachen Des Semantic Web - XML
 
Datenformate und Standards
Datenformate und StandardsDatenformate und Standards
Datenformate und Standards
 
XHTML
XHTMLXHTML
XHTML
 
Xhtml Coding (nicht nur für Bibliotheken)
Xhtml Coding (nicht nur für Bibliotheken)Xhtml Coding (nicht nur für Bibliotheken)
Xhtml Coding (nicht nur für Bibliotheken)
 
Baustein 07 grundlagen-html-css-php
Baustein 07 grundlagen-html-css-phpBaustein 07 grundlagen-html-css-php
Baustein 07 grundlagen-html-css-php
 
Fortbildung Schulwebsite: Technische Grundlagen
Fortbildung Schulwebsite: Technische GrundlagenFortbildung Schulwebsite: Technische Grundlagen
Fortbildung Schulwebsite: Technische Grundlagen
 
Suchmaschinen-Optimierung
Suchmaschinen-OptimierungSuchmaschinen-Optimierung
Suchmaschinen-Optimierung
 
Türme bauen mit Schildbürgern (Webtech Edition)
Türme bauen mit Schildbürgern (Webtech Edition)Türme bauen mit Schildbürgern (Webtech Edition)
Türme bauen mit Schildbürgern (Webtech Edition)
 
Die JSTL Tag-Library
Die JSTL Tag-LibraryDie JSTL Tag-Library
Die JSTL Tag-Library
 
IT-Zertifikat: Advanced Web Basics - Handout HTML II
IT-Zertifikat: Advanced Web Basics - Handout HTML IIIT-Zertifikat: Advanced Web Basics - Handout HTML II
IT-Zertifikat: Advanced Web Basics - Handout HTML II
 

Mehr von lehrerfreund

mySQL - INSERT INTO
mySQL - INSERT INTOmySQL - INSERT INTO
mySQL - INSERT INTOlehrerfreund
 
mySQL - CREATE TABLE
mySQL - CREATE TABLEmySQL - CREATE TABLE
mySQL - CREATE TABLElehrerfreund
 
mySQL - Felddatentypen
mySQL - FelddatentypenmySQL - Felddatentypen
mySQL - Felddatentypenlehrerfreund
 
PHP: Variablen entschaerfen
PHP: Variablen entschaerfenPHP: Variablen entschaerfen
PHP: Variablen entschaerfenlehrerfreund
 
PHP: Indiziertes Array
PHP: Indiziertes ArrayPHP: Indiziertes Array
PHP: Indiziertes Arraylehrerfreund
 
PHP: Rechnen mit PHP
PHP: Rechnen mit PHPPHP: Rechnen mit PHP
PHP: Rechnen mit PHPlehrerfreund
 
PHP: br und n (new line)
PHP: br und n (new line)PHP: br und n (new line)
PHP: br und n (new line)lehrerfreund
 
PHP: Variablen und Datentypen
PHP: Variablen und DatentypenPHP: Variablen und Datentypen
PHP: Variablen und Datentypenlehrerfreund
 
PHP: echo, kommentare
PHP: echo, kommentarePHP: echo, kommentare
PHP: echo, kommentarelehrerfreund
 
CSS: Eigene Stilklassen
CSS: Eigene StilklassenCSS: Eigene Stilklassen
CSS: Eigene Stilklassenlehrerfreund
 
CSS: Listen formatieren
CSS: Listen formatierenCSS: Listen formatieren
CSS: Listen formatierenlehrerfreund
 
CSS: Text horizontal ausrichten
CSS: Text horizontal ausrichtenCSS: Text horizontal ausrichten
CSS: Text horizontal ausrichtenlehrerfreund
 

Mehr von lehrerfreund (18)

ERM - Überblick
ERM - ÜberblickERM - Überblick
ERM - Überblick
 
mySQL - INSERT INTO
mySQL - INSERT INTOmySQL - INSERT INTO
mySQL - INSERT INTO
 
mySQL - CREATE TABLE
mySQL - CREATE TABLEmySQL - CREATE TABLE
mySQL - CREATE TABLE
 
mySQL - SELECT
mySQL - SELECTmySQL - SELECT
mySQL - SELECT
 
mySQL - Felddatentypen
mySQL - FelddatentypenmySQL - Felddatentypen
mySQL - Felddatentypen
 
PHP: foreach
PHP: foreachPHP: foreach
PHP: foreach
 
PHP: Variablen entschaerfen
PHP: Variablen entschaerfenPHP: Variablen entschaerfen
PHP: Variablen entschaerfen
 
PHP: exit
PHP: exitPHP: exit
PHP: exit
 
PHP: isset
PHP: issetPHP: isset
PHP: isset
 
PHP: if-else
PHP: if-elsePHP: if-else
PHP: if-else
 
PHP: Indiziertes Array
PHP: Indiziertes ArrayPHP: Indiziertes Array
PHP: Indiziertes Array
 
PHP: Rechnen mit PHP
PHP: Rechnen mit PHPPHP: Rechnen mit PHP
PHP: Rechnen mit PHP
 
PHP: br und n (new line)
PHP: br und n (new line)PHP: br und n (new line)
PHP: br und n (new line)
 
PHP: Variablen und Datentypen
PHP: Variablen und DatentypenPHP: Variablen und Datentypen
PHP: Variablen und Datentypen
 
PHP: echo, kommentare
PHP: echo, kommentarePHP: echo, kommentare
PHP: echo, kommentare
 
CSS: Eigene Stilklassen
CSS: Eigene StilklassenCSS: Eigene Stilklassen
CSS: Eigene Stilklassen
 
CSS: Listen formatieren
CSS: Listen formatierenCSS: Listen formatieren
CSS: Listen formatieren
 
CSS: Text horizontal ausrichten
CSS: Text horizontal ausrichtenCSS: Text horizontal ausrichten
CSS: Text horizontal ausrichten
 

CSS: Einführung