SlideShare ist ein Scribd-Unternehmen logo
1 von 19
Downloaden Sie, um offline zu lesen
Beyond
Borders
and Boxes
CSS für Fortgeschrittene
Eric Eggert, Essen
Freier Webdesigner/-entwickler
Eric Eggert, Essen
Freier Webdesigner/-entwickler

      (freie Kapazitäten)
@font-face
Syntax
@font-face {   font-family: "Schriftname";
               src: url(schriftname.otf);    }

h1 {
               font-family: Schriftname, Helvetica, sans-serif;
}
kR                        kS
      Einfach              Relativ große Dateien

     Preiswert           Schriftdateien weitgehend
                          ungeschützt (kein DRM)
   Cross-Browser
(IE4+, FF3.5+, Sf3.1+)       Lizenzprobleme

  Weit verbreitet
Transitionen
Transition




:hover

0N
Transformation




:hover

0N
Demos
Demos
        Hover

        Scaling

      Bar Charts

      Demo-Seite

       Gowalla

         Kiwi

24ways Demo, Max Voltar
Danke
 Eric Eggert

  yatil.de

   @yatil

Weitere ähnliche Inhalte

Andere mochten auch

Ergebnisse GGstOf Umfrage 2012
Ergebnisse GGstOf Umfrage 2012Ergebnisse GGstOf Umfrage 2012
Ergebnisse GGstOf Umfrage 2012
netmex.ch
 
Finanzas martínez
Finanzas martínezFinanzas martínez
Finanzas martínez
martrepo
 
Las hormigas del colegio
Las hormigas del colegioLas hormigas del colegio
Las hormigas del colegio
yenderpira
 
SeleneGomez_Spring_2012_Jeremy_C_Foster
SeleneGomez_Spring_2012_Jeremy_C_FosterSeleneGomez_Spring_2012_Jeremy_C_Foster
SeleneGomez_Spring_2012_Jeremy_C_Foster
Jeremy C. Foster
 
maMatemáticas bgu 3
maMatemáticas bgu 3maMatemáticas bgu 3
maMatemáticas bgu 3
juanremacher
 

Andere mochten auch (17)

Diferencias entre-web-10-y-20424 sldo. acosta william
Diferencias entre-web-10-y-20424 sldo. acosta williamDiferencias entre-web-10-y-20424 sldo. acosta william
Diferencias entre-web-10-y-20424 sldo. acosta william
 
Ergebnisse GGstOf Umfrage 2012
Ergebnisse GGstOf Umfrage 2012Ergebnisse GGstOf Umfrage 2012
Ergebnisse GGstOf Umfrage 2012
 
Social Media Success Stories
Social Media Success StoriesSocial Media Success Stories
Social Media Success Stories
 
Asesoria para el uso de las tic.
Asesoria para el uso de las tic.Asesoria para el uso de las tic.
Asesoria para el uso de las tic.
 
Trabajo nº5
Trabajo nº5Trabajo nº5
Trabajo nº5
 
Finanzas martínez
Finanzas martínezFinanzas martínez
Finanzas martínez
 
Las hormigas del colegio
Las hormigas del colegioLas hormigas del colegio
Las hormigas del colegio
 
Typographie
TypographieTypographie
Typographie
 
Ambiente excel
Ambiente excelAmbiente excel
Ambiente excel
 
SeleneGomez_Spring_2012_Jeremy_C_Foster
SeleneGomez_Spring_2012_Jeremy_C_FosterSeleneGomez_Spring_2012_Jeremy_C_Foster
SeleneGomez_Spring_2012_Jeremy_C_Foster
 
Política internacional frente al tráfico de drogas en latino américa
Política internacional frente al tráfico de drogas en latino américaPolítica internacional frente al tráfico de drogas en latino américa
Política internacional frente al tráfico de drogas en latino américa
 
Act 6 redes sociales (zinjal)
Act 6  redes sociales  (zinjal)Act 6  redes sociales  (zinjal)
Act 6 redes sociales (zinjal)
 
maMatemáticas bgu 3
maMatemáticas bgu 3maMatemáticas bgu 3
maMatemáticas bgu 3
 
El piojo
El piojoEl piojo
El piojo
 
Banco de archivo diana maria quiroz villada
Banco de archivo diana maria quiroz villadaBanco de archivo diana maria quiroz villada
Banco de archivo diana maria quiroz villada
 
Informe - Reunión Anual de Asociados 2015
Informe - Reunión Anual de Asociados 2015Informe - Reunión Anual de Asociados 2015
Informe - Reunión Anual de Asociados 2015
 
Morning linedealfonsorodriguezveralar14feb15
Morning linedealfonsorodriguezveralar14feb15Morning linedealfonsorodriguezveralar14feb15
Morning linedealfonsorodriguezveralar14feb15
 

Mehr von Eric Eggert

Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
Eric Eggert
 
Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)
Eric Eggert
 
Internet-Geschichte und Webtechnologie (Historisches Dokument)
Internet-Geschichte und Webtechnologie (Historisches Dokument)Internet-Geschichte und Webtechnologie (Historisches Dokument)
Internet-Geschichte und Webtechnologie (Historisches Dokument)
Eric Eggert
 
Fehler im Webdesign (Historisches Dokument)
Fehler im Webdesign (Historisches Dokument)Fehler im Webdesign (Historisches Dokument)
Fehler im Webdesign (Historisches Dokument)
Eric Eggert
 
How I stopped worrying and learned to love with defaults – with Notes
How I stopped worrying and learned to love with defaults – with NotesHow I stopped worrying and learned to love with defaults – with Notes
How I stopped worrying and learned to love with defaults – with Notes
Eric Eggert
 
How I stopped worrying and learned to love with defaults — Without notes
How I stopped worrying and learned to love with defaults — Without notesHow I stopped worrying and learned to love with defaults — Without notes
How I stopped worrying and learned to love with defaults — Without notes
Eric Eggert
 
Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...
Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...
Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...
Eric Eggert
 
Fronteers Jam Session: Principles of Accessible Web Design
Fronteers Jam Session: Principles of  Accessible Web DesignFronteers Jam Session: Principles of  Accessible Web Design
Fronteers Jam Session: Principles of Accessible Web Design
Eric Eggert
 
Webtech ’09 – Die Zukunft des Webs beginnt jetzt
Webtech ’09 – Die Zukunft des Webs beginnt jetztWebtech ’09 – Die Zukunft des Webs beginnt jetzt
Webtech ’09 – Die Zukunft des Webs beginnt jetzt
Eric Eggert
 
Nutze die Macht @ IKT-Forum 09 Linz
Nutze die Macht @ IKT-Forum 09 LinzNutze die Macht @ IKT-Forum 09 Linz
Nutze die Macht @ IKT-Forum 09 Linz
Eric Eggert
 

Mehr von Eric Eggert (20)

ARIA Serious
ARIA SeriousARIA Serious
ARIA Serious
 
What is EOWG?
What is EOWG?What is EOWG?
What is EOWG?
 
What is EOWG?
What is EOWG?What is EOWG?
What is EOWG?
 
DrupalCamp Vienna 2015
DrupalCamp Vienna 2015DrupalCamp Vienna 2015
DrupalCamp Vienna 2015
 
How to improve your website’s accessibility without going crazy
How to improve your website’s accessibility without going crazyHow to improve your website’s accessibility without going crazy
How to improve your website’s accessibility without going crazy
 
Github introduction for W3C WCAG WG and EOWG
Github introduction for W3C WCAG WG and EOWGGithub introduction for W3C WCAG WG and EOWG
Github introduction for W3C WCAG WG and EOWG
 
Neue Infos rund um WCAG 2.0
Neue Infos rund um WCAG 2.0Neue Infos rund um WCAG 2.0
Neue Infos rund um WCAG 2.0
 
How to Learn about accessibility without going crazy #fronteers15
How to Learn about accessibility without going crazy #fronteers15How to Learn about accessibility without going crazy #fronteers15
How to Learn about accessibility without going crazy #fronteers15
 
New developments in Web Accessibility
New developments in Web AccessibilityNew developments in Web Accessibility
New developments in Web Accessibility
 
Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)Internet und Webdesign (Historisches Dokument)
Internet und Webdesign (Historisches Dokument)
 
Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)Vorteile von Webstandards (Historisches Dokument)
Vorteile von Webstandards (Historisches Dokument)
 
Internet-Geschichte und Webtechnologie (Historisches Dokument)
Internet-Geschichte und Webtechnologie (Historisches Dokument)Internet-Geschichte und Webtechnologie (Historisches Dokument)
Internet-Geschichte und Webtechnologie (Historisches Dokument)
 
Fehler im Webdesign (Historisches Dokument)
Fehler im Webdesign (Historisches Dokument)Fehler im Webdesign (Historisches Dokument)
Fehler im Webdesign (Historisches Dokument)
 
How I stopped worrying and learned to love with defaults – with Notes
How I stopped worrying and learned to love with defaults – with NotesHow I stopped worrying and learned to love with defaults – with Notes
How I stopped worrying and learned to love with defaults – with Notes
 
How I stopped worrying and learned to love with defaults — Without notes
How I stopped worrying and learned to love with defaults — Without notesHow I stopped worrying and learned to love with defaults — Without notes
How I stopped worrying and learned to love with defaults — Without notes
 
Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...
Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...
Neue aufregende Web Technologien, HTML5 + CSS3 anhand von Praxisbeispielen le...
 
Fronteers Jam Session: Principles of Accessible Web Design
Fronteers Jam Session: Principles of  Accessible Web DesignFronteers Jam Session: Principles of  Accessible Web Design
Fronteers Jam Session: Principles of Accessible Web Design
 
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
Accessibility 101 @ Webmontag Frankfurt Ignite, 2010-03-01
 
Webtech ’09 – Die Zukunft des Webs beginnt jetzt
Webtech ’09 – Die Zukunft des Webs beginnt jetztWebtech ’09 – Die Zukunft des Webs beginnt jetzt
Webtech ’09 – Die Zukunft des Webs beginnt jetzt
 
Nutze die Macht @ IKT-Forum 09 Linz
Nutze die Macht @ IKT-Forum 09 LinzNutze die Macht @ IKT-Forum 09 Linz
Nutze die Macht @ IKT-Forum 09 Linz
 

Webmontag Frankfurt 18.01.2010 — Beyond Borders and Boxes – Fortgeschrittene CSS-Techniken