2015-05-12 12 views
6

Ho 300 righe di CSS, costituite da molte regole che ho bisogno di testare su una pagina.Come aggiungere più regole css contemporaneamente tramite Dev-Tools o Firebug

Preferisco incollare le regole in una volta nella parte inferiore del file main.css utilizzato dalla pagina oppure aggiungere un foglio pseudo "extra-main.css" alla pagina con le mie regole.

Attualmente non ho accesso alla fonte della pagina, quindi devo lavorare sulla pagina live. Non perfetto lo so.

Quale sarebbe il modo migliore per farlo? Firebug, DevTools (cromo), qualcosa d'altro ...

+0

Su strumenti di sviluppo quando si ispezionare qualcosa , vedrai in alto a destra dell'elemento c'è il nome sorgente CSS originale. Fai clic e incolla il tuo CSS e premi CTRL + S per vedere le modifiche in tempo reale. –

risposta

4

Entro Elementi il pannello DevTools Chrome click l'origine dell'elemento, pasta nel CSS per testare e colpire Ctrl +S per vedere il aggiornamenti. Puoi fare clic su qualsiasi elemento della pagina che desideri testare finché il file sorgente CSS lo esegue.

Pasting multiple CSS rules in Chrome DevTools

+0

Sembra non funzionare con i file 'scss'. –

+0

corretto. Come sostituire un file SCSS nel browser stesso sarebbe in un formato non riconosciuto. Sarà necessario compilare il file SCSS e quindi utilizzare il CSS in uscita nella posizione appropriata. –

0

In Firebug è simile alle DevTools Chrome, ho appena scoperto.

  1. aprire Firebug
  2. Selezionare la scheda CSS
  3. Selezionare il file css che si desidera modificare
  4. selezionare Modifica dal vivo

How to add CSS sources in Firebug

+0

Oltre all'immagine animata, è necessario aggiungere alcuni passaggi che descrivono come incollare il CSS. –

Problemi correlati