Logo Adobe Certified Expert (ACE) und Adobe Certified Instructor (ACI) für Adobe Acrobat

Aktuelle Links zum Thema: »CSS und HTML«

Wie verhalten sich Inline-Elemente mit einem Padding
Hundekopf - Logo von maxdesignWer schon mal versucht hat, einem inline-Element ein padding zuzuweisen, wird wohl selbst schon festgestellt haben, dass sich inline-Elemente hier anders verhalten als Block-Elemente. Russ Weakley von maxdesign beschreibt dieses Verhalten anschaulich und leicht nachvollziehbar (Englisch).

Besprochene Seite besuchen

Kategorie: | |

Alle Internet Explorer gleichzeitig auf einem Rechner
Tredosoft LogoTredoSoft bietet einen Installer, der es erlaubt, alle IE Versionen auf einem Rechner zu installieren. Einfach neben dem IE 7 installieren und man hat alle Versionen ab der Vs. 3. (via Dr. Web).

Besprochene Seite besuchen

Kategorie: |

Experimente mit Cascading Style Sheets
Cssplay - LogoDie Homepage von Stu Nichols, in der er eine unglaubliche Fülle von raffinierten CSS-Tricks ausbreitet: Menüs, Layout-Techniken, Boxen mit runden Kanten, Photogalerien und vieles mehr. Unbedingt vorbeischauen ...

Besprochene Seite besuchen

Kategorie: | | |

CSS Optimizer im Test
Basic Thinking - LogoausschnittRobert Basic testet einen CSS-Optimizer, den Icey CSS Compressor. CSS-Optimizer sind kleine Hilfsprogramme, die Style Sheets »eindampfen« können – also alles Überflüssige rauswerfen und die Schreibweise optimieren. Einen Vergleich von verschiedenen Optimizern gibts im Artikel »CSS Optimization: Make Your Sites Load Faster for Free«.

Besprochene Seite besuchen

Kategorie: |

Runde Ecken mit CSS - ein Überblick
Smiley Cat - LogoEine umfangreiche Linksammlung, wie man runde Ecken mit CSS erstellen kann: mit und ohne Bilder, mit und ohne JavaScript.

Besprochene Seite besuchen

Kategorie: |

Runde Ecken mit JavaScript
Nifty - LogoAlessandro Fulciniti beschreibt in seinem Artikel »Nifty Corners Cube« die Erstellung von runden Ecken mit Hilfe von CSS und JavaScript, ganz ohne Bilder. CSS und JavaScript können heruntergeladen werden, die Beispiele sind sehr ausführlich, leider nur in Englisch.

Besprochene Seite besuchen

Kategorie: |

Runde Ecken ohne Bilder
Bild 17Tomasz Lewandowski beschreibt in diesem Artikel eine Technik, wie mit Hilfe von CSS-Auszeichnungen (zugegeben ziemlich umfangreichen) runde Ecken gestaltet werden können, ohne dass man Bilder zu Hilfe nehmen muss. Er bezieht sich auf Arbeiten von Stu Nichols (»Krazy Korners«).

Besprochene Seite besuchen

Kategorie: |

Redesigning a Simple Table
IllustrationIn zwei (englischsprachigen) Artikeln erläutert Luke Wroblewski wie man Tabellen benutzbarer machen kann, indem man zunächst alles unwichtige weg lässt (»So the Necessary May Speak«) und wie man anschließend die Aussage durch gestalterische Mittel noch klarer machen kann (»Redesigning a Simple Table«). Ich finde das Ergebnis ansprechend und den beschriebenen Ablauf hilfreich bei eigenen Gestaltungen.

Besprochene Seite besuchen

Kategorie: | |

Vertikal zentrieren mit CSS
Illustration - VogelDie vertikale Zentrierung von einzelnen Objekten in einem CSS-Container war und ist ein Problem, da diese Technik von CSS eigentlich nicht vorgesehen ist. In standardkonformen Browsern gibt es die Möglichkeit, mit display:table, display:table-cell zu arbeiten und mit vertical-align: middle zu zentrieren. Allerdings versteht der Internet Explorer dieses Konzept nicht, er muss also mit Hacks überlistet werden. In einem Artikel von Jeena Paradies werden einige der Konzepte vorgestellt; nachfolgend die Links, die im Artikel und in den Kommentaren genannt werden: »Vertical Centering in CSS« (mit ausführlicher Anleitung), »Shrink-wrap and Center« (nur Beispiel, ohne Anleitung), »CSS vertical centering using float and clear« (ebenfalls nur Beispiel).

Besprochene Seite besuchen

Kategorie: | | |

Open Source Web Templates OSWT
Bild 7-1Eine Sammlung von frei benutzbaren Templates, aufgeteilt nach XHTML Strict und Transitional. Einige sehen recht brauchbar aus. Auf der Seite finden sich auch Links zu kommerziellen Template-Anbietern wie »Template Monster« und anderen.

Besprochene Seite besuchen

Kategorie: |

Css Web Layouts
css web - LogoVier frei nutzbare CSS-Templates. Sie sind tabellenfrei, validieren allerdings nicht ganz. Die Fehler halten sich in Grenzen und können vermutlich leicht ausgebessert werden. Das Verhalten unter unterschiedlichen Browsern habe ich nicht getestet. (via F-LOG-GE)

Besprochene Seite besuchen

Kategorie: |

Free Css Templates
Free Css - LogoEine Sammlung von freien CSS-Templates, die recht brauchbar aussehen. Bei einem habe ich das Markup getestet, ergab ein valides XHTML-Dokument. (via F-LOG-GE)

Besprochene Seite besuchen

Kategorie: |

css design templates
Würfel LogoEine Sammlung von freien CSS-Templates und Wordpress Themes. Es handelt sich um reine CSS-Layouts ohne Tabellen, allerdings habe ich sie nicht in verschiedenen Browsern getestet. Ein Markup-Test ergibt einige Fehler, allerdings vermutlich nur wegen eines eingeblendeten Auswahl- Formularfeldes für die Vorschau. Die Templates selbst scheinen weitgehend zu validieren. (via F-LOG-GE)

Besprochene Seite besuchen

Kategorie: |

Transparente Bereiche in Internetseiten
Logo von SelfHTMLDieser Artikel zeigt, wie Sie in Ihren Internetseiten Transparenzeffekte einsetzen können: über eine GIF-Grafik, über die CSS-Eigenschaft »opacity«, über eine Simulation mit übereinanderliegenden (nicht-transparenten) Bildern oder mittels einer PNG-Grafik. Der Artikel beschreibt die jeweiligen Vor- und Nachteile der Methoden und erläutert vor allem die Einschränkungen durch den Internet Explorer bis Vs. 7.

Besprochene Seite besuchen

Kategorie: | |

Schrift: technische Grundlagen
Types - LogoInfos zu Installation und Verwaltung von Schriften unter Mac OS und Windows, Zeichenkodierung, Unicode, Schriftformate und Schrifttechnologien (Type 1, TrueType, Opentype, CID-Schriften). Verständlich erläutert und übersichtlich dargestellt. Abgerundet durch eine Linksammlung zum Thema Schrift.

Besprochene Seite besuchen

Kategorie: | | | | |

Schriftnamen herausfinden
Fonts - ein Mottoist manchmal ganz schön schwierig. Gut, dass es einige sehr hilfreiche Internetseiten gibt, die einem einen guten Teil der Arbeit abnehmen können. bei Identifonts kann man Fonts nach Namen suchen und sich dann ähnliche Schriften anzeigen lassen. Ausserdem kann man Schriften suchen, indem man eine Reihe von Fragen zu ihrem Aussehen beantwortet (leider nur in Englisch). Bei myFonts kann man sogar einen Scan oder ein Bildschirmfoto einer Schrift hochladen und die Schrift automatisch erkennen lassen. Das hat in meinen Tests gar nicht schlecht funktioniert.

Besprochene Seite besuchen

Kategorie: | | |

Einführung in XHTML, CSS und Webdesign
IllustrationEine ziemlich umfassende Einführung in die Themen XHTML und CSS von Michael Jendryschik. Er richtet sich an Anfänger und an Profis, die ihr Wissen in Teilgebieten vertiefen oder einfach einiges nachschlagen wollen. Es ist kein direktes Lehrbuch, eher eine Referenz. Schön gestaltet sind die Seiten obendrein.

Besprochene Seite besuchen

Kategorie: | |

Testseite für IE7 Float-Bugs
Bildausschnitt von high resolutionDirk hat eine Testseite für die in Beta 2 noch vorhandenen Float-Bugs des IE 7 zusammengestellt. Interessanterweise treten auch einige der von IE 6 bekannten Fehler (Guillotine-Bug oder Kollabierende Margin) unter bestimmten Bedingungen immer noch auf. [Update] Wie Dirk hier beschreibt, sind die meisten Fehler auch in Beta 3 immer noch vorhanden.

Besprochene Seite besuchen

Kategorie: |

YAML - CSS-Framework für Typo3
yaml-LogoYAML (Yet Another Multicolumn Layout) ist ein CSS-Framework für mehrspaltige, tabellenlose CSS-Designs von Dirk Jesse. Das Framework kann unter der Creative Commons Lizenz frei verwendet werden, solange sich in der Homepage ein Link auf YAML befindet, es können aber auch kommerzielle Lizenzen erworben werden, die keinen Link erfordern. Auf den Seiten von YAML finden Sie ausserdem eines der besten Tutorials zu CSS-Layouts in deutscher Sprache. Absolut empfehlenswert! Dieter Bunkerd wiederum hat YAML in ein Typo3-Template integriert und beschreibt die Implementierung in einem informativen Workshop, der zudem auch auf einige wichtige Extensions eingeht, zum Beispiel tt_news, google-sitemap und mehr.

Besprochene Seite besuchen

Kategorie: | | | | |

CSS-Bugs: Explorer Exposed
IllustrationNoch eine Sammlung von CSS-Bugs im Internet-Explorer, diesmal allerdings mit Lösungen und Workarounds. Die umfangreichste, die ich bisher gefunden habe. Leider nur in englischer Sprache. Auf der Homepage von positioniseverything.net gibt es noch viele weitere Quellen zu CSS, unter anderem Bugs von Opera oder Mozilla.

Besprochene Seite besuchen

Kategorie: | |

Seite 2 von 5 Seite(n)  <  1 2 3 4 >  Letzte »

 

Aktuelle Seminartermine:

Seminarkalender abonnieren

Icon einer Kalenderdatei
Seminarkalender als .ics-Datei: Für Kalenderanwendungen herunterladen (alle Systeme)
Icon einer Kalenderdatei
Seminarkalender für iCal: Kalender abonnieren (nur Mac OS X)