Video: Pinselgröße und Deckkraft schnell ändern - TUTORIAL 2024
Seit Jahren sind Webdesigner haben Transparenz in Websites verwendet, indem Bilder im PNG- oder GIF-Format gespeichert und eine Farbe transparent gemacht wurde. Obwohl diese Methode nicht ideal ist, hat sie dazu beigetragen, Bilder scheinbar auf einer Seite "schweben" zu lassen und ein Bild über ein anderes zu legen, indem ein Bild auf einer Seite über einem Hintergrundbild platziert wird.
Dank CSS 3 können Sie jetzt transparente Hintergründe erstellen und sogar unterschiedliche Opazitätsstufen festlegen, um subtilere Designeffekte für Seiten zu erzielen, die auf dem iPhone und iPad angezeigt werden. Sie können die Opazitätseigenschaft mit RGBa-Farben verwenden, um anspruchsvolle Transparenzfunktionen in Ihren Entwürfen zu erstellen, wie z. B. die in dieser Abbildung gezeigte transparente Dropdown-Navigationsliste.
Wenn Sie die Deckkraft des Hintergrunds hinter der Dropdown-Liste ändern, wird das dahinter liegende Bild durchscheint und ein subtilerer Designeffekt erzeugt.
In dem gezeigten Beispiel wurde der Hintergrund des Menüs in einem durchsichtigen Grau dargestellt und nicht in dem einheitlichen Grau, das im gleichen Design wie in dieser Abbildung verwendet wurde.
Die Opazitätseinstellungen in CSS 3 bieten eine große Flexibilität bei der Option, eine RGBa-Farbe zu verwenden und die Transparenz festzulegen.
