Content Màrqueting

Blogger: estil CSS per al codi al vostre bloc

Un amic em va preguntar com vaig fer les regions del codi a l'entrada de Blogger. Ho vaig fer utilitzant una etiqueta d'estil per a CSS a la meva plantilla de Blogger. Això és el que he afegit:

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: Aquesta és una regla CSS que s'orienta a HTML <p> elements amb el nom de classe "codi". Vol dir que qualsevol paràgraf amb aquesta classe tindrà un estil d'acord amb les propietats següents.
  2. font-family: Courier New;: aquesta propietat estableix la família de tipus de lletra en "Courier New". Especifica el tipus de lletra que s'utilitzarà per al text dins dels elements de destinació.
  3. font-size: 8pt;: Aquesta propietat estableix la mida de la lletra en 8 punts. El text dels elements orientats es mostrarà amb aquesta mida de lletra.
  4. border-style: inset;: aquesta propietat estableix l'estil de la vora en "insert". Crea una aparença enfonsada o pressionada per a la vora al voltant dels elements objectiu.
  5. border-width: 3px;: aquesta propietat estableix l'amplada de la vora en 3 píxels. La vora al voltant dels elements tindrà un gruix de 3 píxels.
  6. padding: 5px;: aquesta propietat afegeix 5 píxels de farciment al voltant del contingut dins dels elements orientats. Proporciona espai entre el text i la vora.
  7. background-color: #FFFFFF;: Aquesta propietat estableix el color de fons en blanc (#FFFFFF). El contingut dels elements orientats tindrà un fons blanc.
  8. line-height: 100%;: Aquesta propietat estableix l'alçada de la línia al 100% de la mida de la lletra. Assegura que les línies de text estiguin espaiades segons la mida de la lletra.
  9. margin: 10px;: Aquesta propietat afegeix un marge de 10 píxels al voltant de tot l'element. Proporciona espai entre aquest element i altres elements de la pàgina.

El codi CSS proporcionat defineix un estil per als paràgrafs HTML amb la classe "codi". Estableix el tipus de lletra, la mida de la lletra, l'estil de la vora, l'amplada de la vora, el farciment, el color de fons, l'alçada de la línia i el marge d'aquests paràgrafs. Aquest estil es pot aplicar a fragments de codi o text preformatat d'una publicació de Blogger per donar-los un aspecte específic.

Així es veurà:

codi p. {
font-family: Courier New;
mida de la lletra: 8pt;
estil de vora: inserció;
ample de la vora: 3px;
encoixinat: 5px;
color de fons: #FFFFFF;
alçada de línia: 100%;
marge: 10px;
}

Codificació feliç!

Douglas Karr

Douglas Karr és CMO de OpenINSIGHTS i el fundador de la Martech Zone. Douglas ha ajudat a desenes d'empreses d'èxit de MarTech, ha ajudat en la diligència deguda de més de 5 mil milions de dòlars en adquisicions i inversions de Martech i continua ajudant les empreses a implementar i automatitzar les seves estratègies de vendes i màrqueting. Douglas és un expert i conferenciant de MarTech en transformació digital reconegut internacionalment. Douglas també és autor publicat d'una guia de Dummie i d'un llibre sobre lideratge empresarial.

Articles Relacionats

Torna al botó superior
a prop

Adblock detectat

Martech Zone és capaç de proporcionar-vos aquest contingut sense cap cost perquè monetitzem el nostre lloc mitjançant ingressos publicitaris, enllaços d'afiliats i patrocinis. Agrairem que elimineu el bloquejador d'anuncis mentre visualitzeu el nostre lloc.