HTML+CSS für Grafik
als Präsentation ▻Mit HTML und CSS kann man grafisch arbeiten, sogar in 3d.
▻Rechtecke und Balkengrafik
Block-Bildende Tags in HTML werden als Rechtecke dargestellt. Das alleine reicht schon aus um z.B. eine einfache Balkengrafik zu gestalten.
Im Artikel Accessible Data Visualization with Web Standards beschreibt Wilson Miner die Entwicklung solch einer Grafik:
▻CSS und Formen
Mit etwas CSS kann man von den Rechtecken zu anderen Formen gelangen.
Auf der Webseite CSS Tricks: The Shapes of CSS beschreibt
Chris Coyier wie man mit border-radius
und transparenten rahmen
Kreise, Ellipsen, Dreiecke und so weiter bauen kann:
#triangle-up { width: 0; height: 0; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 100px solid red; }
An einem Standard für CSS Shapes wird gearbeitet, es gibt aber noch keine Implementierungen, siehe Draft: CSS Shapes.
▻Perspektive
Seit 2013 liegt der Standard für CSS Transforms vor, er ist aber immer noch ein “Draft”. In den Browsern sind 3D Transforms aber längst implementiert
Von David DeSandro gibt es ein ausführliches Tutorial dazu.
▻Resume
Im zweifelsfall sollten Sie immer die einfachste technische Lösung für ihr Problem wählen. Bei Grafik kann das ganz oft einfaches HTML + CSS sein.
Kapitel
- Das Web Und Html
- Css
- Css Layout
- Urls
- Formulare
- Javascript Dom
- Jquery
- Kommandozeile
- Git
- Http
- Php Vorbereitung
- Php
- Php Db Lesen
- Session
- Php Db Schreiben
- Php Db Optimierung
- Grafik
- Javascript
- Applied Jquery And Css
- Json
- Xml
- Security
- Injection
- Authentifizierung und Session-Management
- Cross Site Scripting (XSS)
- Unsichere direkte Objektreferenzen
- Sicherheitsrelevante Fehlkonfiguration
- Verlust der Vertraulichkeit sensibler Daten
- Fehlerhafte Autorisierung auf Anwendungsebene
- Cross-Site Request Forgery (CSRF)
- Nutzung von Komponenten mit bekannten Schwachstellen
- Ungeprüfte Um- und Weiterleitungen
- Wordpress
- Apache
- Advanced Javascript
- Qualitaet