← Tutti gli esempi

SoundCloud: evidenzia le aree chiave del layout

Contorna i principali contenitori di SoundCloud con un bordo tratteggiato per scrivere CSS più facilmente.

Codice da copiare

// Outline key SoundCloud layout regions to help write custom styles
const targets = ['.playControls', '.soundList', '.l-main', '.header', '.sidebarModule', '.playbackSoundBadge'];
targets.forEach(function (sel) {
  document.querySelectorAll(sel).forEach(function (el) {
    el.style.outline = '2px dashed #ff5500';
    el.style.outlineOffset = '-2px';
  });
});

Come usare questo esempio

1. Copia il codice con il pulsante qui sopra.
2. Installa JustZix (2 minuti) e apri l'estensione sulla pagina di destinazione.
3. Aggiungi una nuova regola corrispondente a quella pagina.
4. Incolla il codice nel pannello JavaScript della regola e salva — viene eseguito a ogni visita della pagina.