Wie kann ich in Chrome DevTools vorgenommene CSS-Änderungen dauerhaft speichern?

Persistente CSS-Änderungen aus dem Styles-Panel der Chrome-Entwicklertools

Problembeschreibung:

CSS-Änderungen, die im vorgenommen wurden, können nicht gespeichert werden Stile-Bedienfeld der Google Chrome Developer Tools, obwohl in der Dokumentation darauf hingewiesen wird, dass es in der Ressource sichtbar sein sollte Panel.

Lösung:

Chrome bietet jetzt die Möglichkeit, lokale Ordner zu seinem Arbeitsbereich hinzuzufügen. Durch die Nutzung dieser Funktion können Sie eine Webressource einer lokalen Ressource zuordnen und Ihre CSS-Änderungen direkt aus den Entwicklertools speichern.

Schritte:

1. Ordner zum Arbeitsbereich hinzufügen:

   • Navigieren Sie zum Quellenfenster des Entwicklers Extras.
   • Klicken Sie mit der rechten Maustaste in den linken Bereich und wählen Sie „Ordner zum Arbeitsbereich hinzufügen“.
   • Wählen Sie den Ordner aus, der Ihre CSS-Datei enthält.

2. Chrome-Zugriff gewähren:

   • Eine Eingabeaufforderung wird angezeigt, in der Sie um Erlaubnis zum Zugriff gebeten werden Ordner.
   • Chrome-Zugriff gewähren.

3. Netzwerk der lokalen Ressource zuordnen:

   • Laden Sie den Ordner neu Seite.
   • Suchen Sie die entsprechende zugeordnete Datei unter „Quellen“.
   • Klicken Sie mit der rechten Maustaste auf den Dateinamen und wählen Sie „Zu Dateisystemressource zuordnen“ aus.
   • Navigieren Sie zur lokalen Datei und wählen Sie sie aus.

4. Änderungen speichern:

   • Nehmen Sie Ihre CSS-Änderungen in der Karte vor Datei.
   • Drücken Sie STRG S, um die Änderungen zu speichern.

Zusätzliche Hinweise:

• Sie Möglicherweise müssen Sie die zugeordnete Datei öffnen und bearbeiten, um die Anwendung lokaler Änderungen zu starten.
• Wenn Sie die Stile nicht sehen Klicken Sie im Bedienfeld „Elemente“ auf das Dreipunktsymbol in der oberen rechten Ecke und wählen Sie „Stile anzeigen“.

Das obige ist der detaillierte Inhalt vonWie kann ich in Chrome DevTools vorgenommene CSS-Änderungen dauerhaft speichern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!