Können Sie in Chrome Inspector neue CSS-Eigenschaften hinzufügen?

8

Ist es möglich, neue CSS-Eigenschaften im Chrome-Inspektor hinzuzufügen? Es scheint, dass Sie nur vorhandene Eigenschaften bearbeiten können.

Gibt es nach dem Bearbeiten der Eigenschaften auch eine Möglichkeit, das überarbeitete CSS als Ganzes anzuzeigen?

    
ina 12.07.2011, 08:55
quelle

4 Antworten

6

Sie können eine neue Eigenschaft in einem Regeldoppelklick innerhalb der Regel hinzufügen. Sie können auch eine neue Regel aus dem Rad in der Ecke hinzufügen und dann "Neue Stilregel" auswählen.

Um das gesamte überarbeitete Dokument anzuzeigen, gehen Sie zu: Resources > Frame > site name > Stylesheets > stylesheet-name.css

Oder klicken Sie einfach auf das + Symbol über den css Eigenschaften

    
Sotiris 12.07.2011 09:18
quelle
5

Ja, es ist möglich, neue CSS-Eigenschaften im Chrome-Inspektor hinzuzufügen und sie in einigen einfachen Schritten zu überprüfen:

  1. Klicken Sie mit der rechten Maustaste in das Element, das Sie ändern möchten, und wählen Sie "Element prüfen";
  2. Klicken Sie auf die Schaltfläche "Neue Stilregel" ( 1 im Bild unten );
  3. Google Chrome weist eine CSS-Anpassungsregel zu, die Sie umbenennen können ( 2 im Bild unten );
  4. Fügen Sie Ihre CSS-Regeln hinzu ( 2 im Bild unten );
  5. Wenn Sie fertig sind, überprüfen Sie einfach den Bereich "Berechneter Stil" ( 3 im Bild unten ).

    
Rolando Isidoro 26.02.2013 12:19
quelle
4
  

Ist es möglich, neue CSS-Eigenschaften im Chrome-Inspektor hinzuzufügen? Es   scheint, dass Sie nur vorhandene Eigenschaften bearbeiten können ...

Doppelklicken Sie einfach in eine beliebige weiße und leere Stelle im Bedienfeld "Stile".

Ich tendiere dazu, rechts neben } für die CSS-Regel, die ich bearbeiten möchte, einen Doppelklick auszuführen.

  

Sobald Sie die Eigenschaften bearbeitet haben, gibt es auch eine Möglichkeit, die überarbeiteten Eigenschaften anzuzeigen   CSS als Ganzes?

Siehe @ Sotiris 'Antwort .

Nicht, dass ich wüsste.

There kann eine Erweiterung sein, die dies kann, aber falls eine existiert, wird sie wahrscheinlich nicht die exakte Formatierung Ihres ursprünglichen CSS beibehalten.

    
thirtydot 12.07.2011 09:11
quelle
2

Warum nicht? Hier sehen Sie den Screenshot des Bereichs Styles des Google Chrome-Inspektors

Beachten Sie den Block:

%Vor%

Sie klicken einfach mit der Maus in diesen Bereich und Inspektor gibt Ihnen die Möglichkeit, neue Stile hinzuzufügen. Wenn Sie einem Element ein neues Attribut hinzufügen müssen, klicken Sie mit der rechten Maustaste darauf im Bereich Elements und wählen Sie 'Attribut hinzufügen'.

  

Gibt es nach dem Bearbeiten der Eigenschaften auch eine Möglichkeit, das überarbeitete CSS als Ganzes anzuzeigen?

Gibt% Computed Style panel Ihnen diese Informationen nicht? Dort können Sie prüfen, welche Stile auf einen Knoten angewendet werden und in welcher Regel und von welchem ​​Stylesheet sie angewendet werden.

    
spliter 12.07.2011 09:06
quelle