Code Ausschnitte 2025, April
.stitched (Polsterung: 20px; Rand: 10px; Hintergrund: # ff0030; Farbe: #fff; Schriftgröße: 21px; Schriftgröße: fett; Zeilenhöhe: 1.3em; Rand: 2px gestrichelt "
P (Schriftgröße: 24px! wichtig;) Die! wichtige Regel am Ende eines Werts überschreibt alle anderen Stildeklarationen dieses Attributs, einschließlich Inline ".
A (/ * vollständig gültige URL, wahrscheinlich externer Link * /) a (/ * Link zu einer bestimmten Website * /) a, a (/ * interner relativer Link * /) a (/ * E-Mail-Link * /) a (/ * ""
Eine beliebte Designtechnik besteht darin, einen Inhaltsbehälter zu erstellen, der wie ein Blatt Papier aussieht, und andere Blätter darunter zu stapeln und eine Schicht hinzuzufügen. "
Home Katalog Preis Über Contact nav (Breite: 960px; Höhe: 100px; Rand: 120px Auto; Textausrichtung: Mitte;) .top-menu li (Anzeige: Inline-Block; "
Hier ist für Google Code Prettify (an dieser Quelle gefunden). .prettyprint (Farbe: # 839496; Hintergrundfarbe: # 002b36;) .prettyprint .pln (Farbe: erben;) "
H1 # logo (Breite: 200px; // Breite der Bildhöhe: 100px; // Höhe des Bildhintergrunds: URL (../ path / to / image.jpg.webp); Texteinzug: -9999px;) Diese Technik "
Das Blockquote wird in standardkonformen Browsern mit dem Effekt "Big Quotes Before" und im IE mit einem dicken linken Rand und einem Hellgrau angezeigt.
Erfordert jQuery und jQuery UI für den eigentlichen Schieberegler. Das Gesicht besteht aus Elementen, die zu Kreisen mit Randradius geformt wurden. Der Mund zeigt Glück an "
Aus der Fußzeile des v8-Designs von CSS-Tricks. Demo-Fußzeile anzeigen (klar: beides; Überlauf: versteckt; Schriftgröße: 16px; Zeilenhöhe: 1,3;) # Fußzeilenfelder ("
Standardmäßig verfügen alle IE-Versionen über eine Bildlaufleiste in Textbereichen, auch wenn diese leer sind. Kein anderer Browser tut dies. Wenn Sie es also entfernen möchten, kann der IE "
Jeder alte Ankerlink kann ein Link zu einem PDF-Dokument sein, aber das Klicken auf einen solchen Link kann für einen Benutzer überraschend und unangenehm sein. Dies"
Dies setzt die Verwendung eines Autoprefixers voraus. .face: hover (Animation: Shake 0.82s Cubic-Bezier (.36, .07, .19, .97) beide; transform: translate3d (0, 0, 0); "
Standard: -moz-border-radius: 10px; -Webkit-Rand-Radius: 10px; Randradius: 10px; / * Zukunftssicherheit * / -khtml-border-radius: 10px; / * für alte "
Bringen Sie Ihre eigenen Präfixe mit! .grow (Übergang: alle .2s Easy-In-Out;) .grow: Hover (Transformation: Skala (1.1);) "
Jeder liebt Bänder .ribbon (Schriftgröße: 16px! wichtig; / * Dieses Band "
Zum Einfügen hochauflösender Grafiken, jedoch nur für Bildschirme, die diese verwenden können. "Retina" ist "2x": @media (-webkit-min-Geräte-Pixel-Verhältnis: 2), "
Es gibt Zeiten, in denen eine wirklich lange Textfolge den Container eines Layouts überlaufen kann. Beispiel: URLs enthalten normalerweise keine Leerzeichen, daher "
Bei Sprachen von rechts nach links können Sie das Standardlayout von links nach rechts in den meisten Browsern einfach über das Attribut dir austauschen. Text von rechts nach links "
A (Gliederung: 0;) Entfernen Sie vorsichtig Gliederungsstile aus Links, da diese eine Usability-Funktion darstellen. Stellen Sie in diesem Fall sicher, dass Sie klare Fokusstile definieren. Wenn"
Es kann manchmal wünschenswert sein, den oberen oder linken Rand vom ersten Element in einem Behälter zu entfernen. Ebenso der rechte oder untere Rand vom letzten "
Diese Seite listet eine Vielzahl verschiedener Geräte und Medienabfragen auf, die speziell auf dieses Gerät abzielen. Das ist wahrscheinlich im Allgemeinen keine gute Praxis, aber es ist hilfreich zu wissen, wie groß die Abmessungen all dieser Geräte in einem CSS-Kontext sind. "
Webkit-Tap-Highlight-Farbe: rgba (0,0,0,0); Und dann, um Folgendes zu ermöglichen: Aktive Stile können in Ihrem CSS auf einer Seite in Mobile Safari verwendet werden: "
Gepunktete Ränder um Links sind eine Eingabehilfenfunktion, über die die meisten Browser standardmäßig verfügen. Es ist für Benutzer, die dort über die Tastatur navigieren müssen oder möchten. "
HTML: .. oder .. Go CSS: input.button (Text-Einzug: -9000px; Text-Transformation: Großschreibung;) Negativer Einzug allein funktioniert leider nicht, um Text zu entfernen. "
Etwas hellere Farbe (vorausgesetzt, Ihr Text ist schwarz), gepunkteter unterer Rand und ein Fragezeichen-Cursor. Dies ist zu einem etwas standardisierten Ansatz geworden. "
Für CSS-Hintergrundbilder .IhrSelektor (Breite: 200px; Höhe: 100px; Hintergrund: URL (/folder/yourimage.png.webp) no-repeat; _background: none; "
Große Notiz hier! Schiebetüren sind eine ziemlich alte Technik. Es hatte seine Zeit im Web, aber es ist heutzutage wahrscheinlich nicht der klügste Weg. Wir haben"
Sup, sub (vertikal ausrichten: Grundlinie; Position: relativ; oben: -0,4 em;) sub (oben: 0,4 em;) "
@media print (a :: after (Inhalt: "(" attr (href) ")";)) "