Marketing Content

Blogger: stile CSS per il codice sul tuo blog

Un amico mi ha chiesto come ho realizzato le regioni del codice nella voce di Blogger. L'ho fatto utilizzando un tag di stile per CSS nel mio modello Blogger. Ecco cosa ho aggiunto:

p.code {
    font-family: Courier New;
    font-size: 8pt;
    border-style: inset;
    border-width: 3px;
    padding: 5px;
    background-color: #FFFFFF;
    line-height: 100%;
    margin: 10px;
}
  1. p.code: questa è una regola CSS destinata all'HTML <p> elementi con il nome della classe "codice". Ciò significa che qualsiasi paragrafo con questa classe avrà uno stile in base alle seguenti proprietà.
  2. font-family: Courier New;: questa proprietà imposta la famiglia di caratteri su "Courier New". Specifica il carattere che verrà utilizzato per il testo all'interno degli elementi di destinazione.
  3. font-size: 8pt;: questa proprietà imposta la dimensione del carattere su 8 punti. Il testo all'interno degli elementi target verrà visualizzato con questa dimensione del carattere.
  4. border-style: inset;: questa proprietà imposta lo stile del bordo su "inserito". Crea un aspetto incavato o pressato per il bordo attorno agli elementi mirati.
  5. border-width: 3px;: questa proprietà imposta la larghezza del bordo su 3 pixel. Il bordo attorno agli elementi avrà uno spessore di 3 pixel.
  6. padding: 5px;: questa proprietà aggiunge 5 pixel di riempimento attorno al contenuto all'interno degli elementi target. Fornisce la spaziatura tra il testo e il bordo.
  7. background-color: #FFFFFF;: Questa proprietà imposta il colore dello sfondo su bianco (#FFFFFF). Il contenuto all'interno degli elementi target avrà uno sfondo bianco.
  8. line-height: 100%;: questa proprietà imposta l'altezza della linea al 100% della dimensione del carattere. Assicura che le righe di testo siano distanziate in base alla dimensione del carattere.
  9. margin: 10px;: questa proprietà aggiunge un margine di 10 pixel attorno all'intero elemento. Fornisce la spaziatura tra questo elemento e gli altri elementi della pagina.

Il codice CSS fornito definisce uno stile per i paragrafi HTML con la classe "codice". Imposta il carattere, la dimensione del carattere, lo stile del bordo, la larghezza del bordo, il riempimento, il colore dello sfondo, l'altezza della linea e il margine per questi paragrafi. Questo stile può essere applicato a frammenti di codice o testo preformattato in un post di Blogger per conferire loro un aspetto specifico.

Ecco come apparirà:

p.codice {
famiglia di caratteri: Courier New;
dimensione carattere: 8pt;
stile bordo: inserito;
larghezza del bordo: 3 px;
padding: 5px;
background-color: #FFFFFF;
altezza della linea: 100%;
margine: 10px;
}

Buona programmazione!

Douglas Karr

Douglas Karr è CMO di ApriINSIGHTS e il fondatore della Martech Zone. Douglas ha aiutato dozzine di startup MarTech di successo, ha assistito nella due diligence di oltre 5 miliardi di dollari in acquisizioni e investimenti Martech e continua ad assistere le aziende nell'implementazione e nell'automazione delle loro strategie di vendita e marketing. Douglas è un esperto e relatore di trasformazione digitale e MarTech riconosciuto a livello internazionale. Douglas è anche autore di una guida per manichini e di un libro sulla leadership aziendale.

Articoli Correlati

Torna a pulsante in alto
Chiudi

Blocco annunci rilevato

Martech Zone è in grado di fornirti questi contenuti gratuitamente perché monetizziamo il nostro sito attraverso entrate pubblicitarie, link di affiliazione e sponsorizzazioni. Ti saremmo grati se rimuovessi il blocco degli annunci mentre visiti il ​​nostro sito.