Optional: Wählen Sie ein Element aus (Absatz, Überschrift usw.), auf das Sie den Übergang anwenden möchten. Stattdessen können Sie auch einen Übergang erstellen und ihn später auf ein Element anwenden.
Zuletzt aktualisiert am
30. April 2021
|
Gilt auch für Adobe Dreamweaver
- Dreamweaver-Benutzerhandbuch
- Einführung
- Dreamweaver und Creative Cloud
- Arbeitsbereiche und Ansichten in Dreamweaver
- Sites einrichten
- Dreamweaver-Sites
- Lokale Version Ihrer Site einrichten
- Verbindung mit einem Publishing Server herstellen
- Testserver einrichten
- Site-Einstellungen importieren und exportieren
- Vorhandene Websites von einem Remote-Server in Ihren lokalen Site-Stammordner kopieren
- Barrierefreie Funktionen in Dreamweaver
- Erweiterte Einstellungen
- Site-Voreinstellungen für die Übertragung von Dateien festlegen
- Proxyserver-Einstellungen in Dreamweaver festlegen
- Dreamweaver-Einstellungen mit Creative Cloud synchronisieren
- Git in Dreamweaver verwenden
- Dateien verwalten
- Dateien öffnen und erstellen
- Dateien und Ordner verwalten
- Dateien vom Server abrufen/auf dem Server bereitstellen
- Dateien einchecken und auschecken
- Dateien synchronisieren
- Dateien auf Unterschiede vergleichen
- Dateien und Ordner in Ihrer Dreamweaver-Site von Operationen ausschließen (Cloaking)
- Design Notes für Dreamweaver-Sites aktivieren
- Potenzielle Gatekeeper-Angriffe verhindern
- Layout und Entwurf
- CSS
- Grundlegendes zu Cascading Stylesheets
- Gestalten von Seitenlayouts mit CSS Designer
- CSS-Präprozessoren in Dreamweaver verwenden
- Voreinstellungen für CSS-Stile in Dreamweaver festlegen
- CSS-Regeln in Dreamweaver verschieben
- Inline-CSS in Dreamweaver in eine CSS-Regel umwandeln
- Mit div-Tags arbeiten
- Verläufe auf den Hintergrund anwenden
- CSS3-Übergangseffekte in Dreamweaver erstellen und bearbeiten
- Code formatieren
- Seiteninhalt und Elemente
- Seiteneigenschaften festlegen
- CSS-Eigenschaften von Überschriften und Links festlegen
- Mit Text arbeiten
- Text, Tags und Attribute suchen und ersetzen
- DOM-Bedienfeld
- In der Live-Ansicht bearbeiten
- In Dreamweaver die Kodierung von Dokumenten festlegen
- Elemente im Dokumentfenster auswählen und anzeigen
- Texteigenschaften im Eigenschafteninspektor festlegen
- Rechtschreibprüfung für Web-Seiten durchführen
- Horizontale Linien in Dreamweaver verwenden
- Schriftkombinationen in Dreamweaver hinzufügen und ändern
- Mit Elementen arbeiten
- Datumsangaben in Dreamweaver einfügen und aktualisieren
- In Dreamweaver Favoritenelemente erstellen und verwalten
- Bilder in Dreamweaver einfügen und bearbeiten
- Medienobjekte hinzufügen
- Videos in Dreamweaver einfügen
- HTML5-Videos einfügen
- SWF-Dateien einfügen
- Audioeffekte hinzufügen
- In Dreamweaver HTML5-Audiodateien einfügen
- Mit Bibliothekselementen arbeiten
- Arabischen und hebräischen Text in Dreamweaver verwenden
- Hyperlinks und Navigation
- jQuery-Widgets und -Effekte
- Websites programmieren
- In Dreamweaver programmieren
- Programmierumgebung in Dreamweaver
- Voreinstellungen für Code festlegen
- Codehervorhebung anpassen
- Code schreiben und bearbeiten
- Codehinweise und Codevervollständigung
- Code aus- und einblenden
- Code mit Codefragmenten wiederverwenden
- Code-Linting
- Code optimieren
- Code in der Entwurfsansicht bearbeiten
- Mit den Head-Inhalten von Seiten arbeiten
- Server-Side Includes in Dreamweaver einfügen
- Tag-Bibliotheken in Dreamweaver verwenden
- Benutzerdefinierte Tags in Dreamweaver importieren
- JavaScript-Verhalten (allgemeine Anweisungen)
- Integrierte JavaScript-Verhalten anwenden
- XML und XSLT
- Server-seitige XSL-Transformationen in Dreamweaver durchführen
- Client-seitige XSL-Transformationen in Dreamweaver durchführen
- Zeichenentitäten für XSLT in Dreamweaver einfügen
- Code formatieren
- Produktübergreifende Arbeitsabläufe
- Erweiterungen für Dreamweaver installieren und verwenden
- In-App-Updates in Dreamweaver
- Microsoft Office-Dokumente in Dreamweaver einfügen (nur Windows)
- Mit Fireworks und Dreamweaver arbeiten
- Mithilfe von Contribute Inhalte in Dreamweaver-Sites bearbeiten
- Dreamweaver-Business Catalyst-Integration
- Personalisierte E-Mail-Kampagnen erstellen
- Vorlagen
- Dreamweaver-Vorlagen
- Vorlagen und vorlagenbasierte Dokumente erkennen
- Dreamweaver-Vorlagen erstellen
- Bearbeitbare Bereiche in Vorlagen erstellen
- Wiederholende Bereiche und Tabellen in Dreamweaver erstellen
- Optionale Bereiche in Vorlagen verwenden
- Bearbeitbare Tag-Attribute in Dreamweaver definieren
- Verschachtelte Vorlagen in Dreamweaver erstellen
- Vorlagen bearbeiten, aktualisieren und löschen
- XML-Inhalte in Dreamweaver exportieren und importieren
- Vorlage auf ein vorhandenes Dokument anwenden oder aus dem Dokument entfernen
- Inhalte in Dreamweaver-Vorlagen bearbeiten
- Syntaxregeln für Vorlagen-Tags in Dreamweaver
- Markierungseinstellungen für Vorlagenbereiche festlegen
- Vorteile von Vorlagen in Dreamweaver
- Mobilgeräte und Multiscreen
- Dynamische Websites, Seiten und Web-Formulare
- Grundlegendes zu Web-Anwendungen
- Computer für die Entwicklung von Anwendungen einrichten
- Fehlerbehebung bei Datenbankverbindungen
- Verbindungsskripts in Dreamweaver entfernen
- Dynamische Seiten entwerfen
- Quellen für dynamischen Inhalt – Überblick
- Quellen für dynamische Inhalte definieren
- Dynamische Inhalte in Seiten einfügen
- Dynamischen Inhalt in Dreamweaver ändern
- Datenbankdatensätze anzeigen
- Live-Daten in Dreamweaver bereitstellen und Fehlerbehebung bei der Anzeige
- Benutzerdefinierte Serververhalten in Dreamweaver hinzufügen
- Formulare mit Dreamweaver erstellen
- Formulare zum Sammeln von Benutzerinformationen verwenden
- ColdFusion-Formulare in Dreamweaver erstellen und aktivieren
- Web-Formulare erstellen
- Verbesserte HTML5-Unterstützung für Formularelemente
- Formularentwicklung mit Dreamweaver
- Visuelles Entwickeln von Anwendungen
- Master- und Detailseiten in Dreamweaver erstellen
- Such- und Ergebnisseiten erstellen
- Datensatz-Einfügeseiten erstellen
- Datensatz-Aktualisierungsseiten in Dreamweaver erstellen
- Datensatz-Löschseiten in Dreamweaver erstellen
- ASP-Befehle zum Ändern von Datenbanken in Dreamweaver verwenden
- Registrierungsseiten erstellen
- Anmeldeseiten erstellen
- Seiten erstellen, auf die nur autorisierte Benutzer zugreifen können
- Ordner in ColdFusion mit Dreamweaver schützen
- ColdFusion-Komponenten in Dreamweaver verwenden
- Websites testen, in der Vorschau anzeigen und veröffentlichen
- Fehlerbehebung
Mithilfe des Bedienfelds „CSS-Übergänge“ können Sie CSS3-Übergänge erstellen, bearbeiten und löschen.
Um einen CSS3-Übergang zu erstellen, erstellen Sie eine Übergangsklasse. Dazu legen Sie die Werte für die Übergangseigenschaften des Elements fest. Wenn Sie ein Element auswählen, bevor Sie eine die Übergangsklasse erstellen, wird die Übergangsklasse automatisch auf das ausgewählte Element angewendet.
Sie können den erzeugten CSS-Code entweder zum aktuellen Dokument hinzufügen oder eine externe CSS-Datei angeben.
Erstellen und Anwenden von CSS3-Übergangseffekten
-
-
Wählen Sie „Fenster“ > „CSS-Übergänge“
-
Klicken Sie auf
. -
Erstellen Sie mithilfe der Optionen im Dialogfeld „Neuer Übergang“ eine Übergangsklasse.
Zielregel
Geben Sie einen Namen für den Selektor ein. Es kann irgendein CSS-Selektor angegeben werden, etwa ein Tag, eine Regel, eine ID oder ein zusammengesetzter Selektor. Wenn Sie beispielsweise auf alle <hr>-Tags Übergangseffekte anwenden wollen, geben Sie hr ein
Übergang bei
Wählen Sie einen Status aus, auf den Sie den Übergang anwenden möchten. Soll der Übergang beispielsweise angewendet werden, wenn die Maus über das Element bewegt wird, verwenden Sie die Option hover.
Verwenden Sie für alle Eigenschaften denselben Übergang.
Aktivieren Sie diese Option, wenn Sie für alle CSS-Eigenschaften dieselbe Dauer, Verzögerung und Zeitfunktion festlegen möchten, die sich im Verlauf des Übergangs allmählich ändern sollen.
Verwenden Sie für jede Eigenschaft einen anderen Übergang.
Aktivieren Sie diese Option, wenn Sie für jede CSS-Eigenschaft, die sich im Verlauf des Übergangs allmählich ändern soll, eine andere Dauer, Verzögerung und Zeitfunktion angeben wollen.
Eigenschaft
Klicken Sie auf
, um zu dem Übergang eine CSS-Eigenschaft hinzuzufügen.Dauer
Geben Sie für die Dauer des Übergangseffekts einen Wert in Sekunden (S) oder Millisekunden (ms) ein.
Verzögerung
Die Zeit (in Sekunden oder Millisekunden), bevor der Übergangseffekt beginnt.
Zeitfunktion
Wählen Sie aus den verfügbaren Optionen einen Übergangsstil aus.
Endwert
Der endgültige Wert für den Übergangseffekt. Wenn Sie beispielsweise den Schriftgrad am Ende des Übergangseffekts um 40 px vergrößern möchten, geben Sie für die Schriftgröße 40 px an.
Auswählen, wo der Übergang erstellt werden soll
Wenn Sie den Stil in das aktuelle Dokument einbetten möchten, wählen Sie „Nur dieses Dokument“.
Wenn Sie ein externes Stylesheet für den CSS3-Code erstellen möchten, wählen Sie „Neue Stylesheet-Datei“ aus. Wenn Sie auf „Übergang erstellen“ klicken, werden Sie aufgefordert, den Pfad anzugeben, in dem die neue CSS-Datei gespeichert werden soll. Nachdem das Stylesheet erstellt worden ist, wird es in das Menü „Auswählen, wo der Übergang erstellt werden soll“ aufgenommen.
Bearbeiten von CSS3-Übergangseffekten
-
Wählen Sie im Bedienfeld „ CSS-Übergänge den Übergangseffekt aus, den Sie bearbeiten möchten.
-
Klicken Sie auf
. -
Ändern Sie im Dialogfeld „Übergang bearbeiten“ zuvor eingegebene Werte für den Übergang.
Deaktivieren der CSS-Kurzschrift für Übergänge
-
Wählen Sie „Bearbeiten“ > „Voreinstellungen“.
-
Wählen Sie „CSS-Stile“.
-
Deaktivieren Sie unter „Kurzschrift verwenden für“ die Option „Übergang“.