Kategorie: CSS
-
Arial kostenlos als Webfont einbinden auf einer Webseite
Wenn man gern Arial als Schriftart auf seiner Webseite einbinden will und möchte, dass auch alle Besucher diese Schriftart verwenden sollen, auch die, die es nicht installiert haben, muss man den Font als Webfont einbinden. Das Problem ist, dass Arial nicht frei verfügbar ist, sondern eine Lizenz dafür erworben werden muss: kostenpflichtiger Download. Wenn man…
-
Icons kostenlos herunterladen
Es gibt im Netz hervorragende und kostenlose Icon-Biliotheken, die kommerziell kostenlos genutzt werden können oder teilweise für einen geringen Betrag gekauft werden können. Mein Favourit: IconMonstr Sehr gute Alternativen sind: icomoon glyphicons glyphish
-
Wieso sollte man kein inline CSS/JS verwenden
Es gilt als schlechter Stil inline CSS zu verwenden: <span style=“color: #666666; display: block; float:left; width: 250px;padding-bottom:5px;“> d.h. das CSS eines Elements direkt über das style Attribut zu aktivieren. Dasselbe gilt auch für Inline Javascript: <div></div> <script type=“text/javascript“> alert(„hallo“); </script> Folgende Gründe gibt es dafür:
-
Debugging Tools für Firefox, IE, Chrome, Safari, Opera
Zum Debuggen von Webseiten braucht man immer spezielle Entwickler Tools für jeden einzelnen Browser, weil sich die Darstellung in jedem Browser ändert oder Javascript Fehler nur in bestimmten Browsern auftreten. Bevor man an die Arbeit geht sollte man unbedingt checken, ab das der Browser Cache deaktiviert ist in dem jeweiligen Browser, sonst erhält man eine…
-
Browser Caching deaktivieren in Firefox, IE, Chrome, Safari, Opera
Als Webdeveloper muss man sich mit allen gängigen Browsern rumschlagen und beherrschen, mit allen zu debuggen. Um dies zu tun, braucht man auf jeden Fall 2 Dinge: deaktivierten Browser Cache, damit man keine alten Seiten sieht und sich wundert, warum sich nichts geändert hat ein Debugger wie Firebug für Firefox siehe Artikel: Debugging Tools für…
-
3 Spalten Layout mit fixer Breite
<div class=’links‘></div> <div class=’mitte‘> </div><div class=’rechts‘></div> .links { background-color: #CCCCCC; width: 253px; float: left; } .mitte { float: left; background-color: #8D8D8D; width: 253px; } .rechts { float: right; background-color: #CCCCCC; width: 253px; }
-
Entfernen von leeren HTML paragraph Tags
Der Editor von WordPress generiert leere <p> Tags, die nicht sehr hilfreich sind beim Gestalten. Eine Lösung via CSS (CSS3 – Kampatibilität :empty): p:empty { display:none; } oder mit besserer Browser Kompatibilität und jQuery: <script> $(„p:empty“).hide(); </script>
-
Cross Browser kompatibeles CSS mit YAML
Wer eine Chance haben will, dass seine Webseite in allen gängigen Browsern gleich aussieht, der ist gezwungen ein CSS Framework zu benutzen, welches die Unterschieder eine einzelnen Browser ausgleicht, wie z.B: YAML. Sehr konfortabel ist auch der YAML Builder, mit dem verschiedene Layouts mit 1,2 oder 3 Spalten erstellt werden können. Einbindung von YAML Als…