HTML di input

CSS estratto

Przyklady estrazione CSS

Estrai CSS dai tag <style> e dagli stili inline. Przyklad:

HTML con stili incorporati

HTML di input:

Input

CSS estratto:

Output

Usa Przyklad in alto per caricare altri dane di esempio.

Cos'è un Estrattore CSS?

I plik HTML spesso incorporano CSS nei tag <style> o negli attributi style inline. Un estrattore CSS analizza l'HTML ed estrae tutti gli stili in un unico plik CSS. Utile per migrare gli stili incorporati in fogli di stile esterni, verificare quale CSS usa una pagina o convertire HTML estratto da web in CSS modificabile. La specifica HTML e la specifica CSS definiscono la struttura.

Questo narzedzie funziona nel tuo browser. Incolla HTML o carica un plik .html. Estrae il contenuto dei blocchi <style> e gli stili inline. Nulla viene inviato a un server. Per formattare l'output, usa il Formater CSS. Per combinare più plik CSS, usa il Combinatore CSS.

Come usare questo narzedzie

1

Incolla o carica HTML

Incolla il tuo HTML nell'editor di sinistra oppure clicca su Wczytaj per caricare un plik .html o .htm. Usa Przyklad per caricare HTML di esempio con stili incorporati.

2

Esamina il CSS estratto

Il pannello di destra mostra il CSS estratto dai tag <style> e dagli stili inline. Per la validazione, usa il Walidator CSS. Per minificare, usa il Minifikator CSS.

3

Kopiuj o scarica

Usa Kopiuj o Pobierz per salvare il CSS. Per convertire HTML in Markdown, usa HTML in Markdown. Per CSS a inline (email), usa CSS a Inline.

Quando l'estrazione CSS è utile

Quando si migra un sito legacy o si converte un documento HTML a plik singolo in un progetto strutturato, estrarre il CSS è il primo passo. I template email, le esportazioni CMS o le pagine estratte dal web spesso hanno stili incorporati. Questo narzedzie fornisce un punto di partenza per il refactoring. MDN HTML e MDN CSS documentano gli standard.

Per combinare il CSS estratto con altri fogli di stile, usa il Combinatore CSS. Per aggiungere prefissi vendor, usa il Prefissatore CSS. Per convertire tra preprocessori, usa SCSS in CSS o Stylus in CSS.

Czesto zadawane pytania

I miei dane sono privati?

Sì. L'estrazione avviene interamente nel tuo browser. Nessun dato viene inviato a un server.

Estrae &#64;import o CSS collegato?

Nie. Estrae solo il contenuto dei blocchi <style> e gli attributi style inline. I fogli di stile esterni (@import o <link>) non vengono recuperati né inclusi.

E gli stili inline?

Gli stili inline vengono estratti e racchiusi in un commento per riferimento. Si applicano a elementi specifici, quindi l'output potrebbe richiedere aggiustamenti manuali per il riutilizzo.

Gestisce gli stili scoped?

Gli stili scoped (es. Vue scoped, incapsulamento della vista Angular) vengono estratti così come sono. Gli attributi di scope potrebbero dover essere considerati quando si usa il CSS altrove.

Posso estrarre da un URL?

Questo narzedzie funziona con HTML incollato o caricato. Per estrarre da un URL, recupera l'HTML altrove e incollalo qui.

Powiazane narzedzia

Scopri di più: W3C CSS, MDN CSS, MDN HTML.