Content Marketing

Blogger: CSS-stijl voor code op uw blog

Een vriend vroeg me hoe ik de coderegio's in Blogger-invoer maakte. Ik deed het met behulp van een stijltag voor CSS in mijn Blogger-sjabloon. Dit is wat ik heb toegevoegd:

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: Dit is een CSS-regel die zich richt op HTML <p> elementen met de klassenaam ‘code’. Het betekent dat elke alinea met deze klasse wordt opgemaakt volgens de volgende eigenschappen.
  2. font-family: Courier New;: Met deze eigenschap wordt de lettertypefamilie ingesteld op 'Courier New'. Het specificeert het lettertype dat zal worden gebruikt voor de tekst binnen de beoogde elementen.
  3. font-size: 8pt;: Met deze eigenschap wordt de lettergrootte ingesteld op 8 punten. De tekst binnen de beoogde elementen wordt met deze lettergrootte weergegeven.
  4. border-style: inset;: Met deze eigenschap wordt de randstijl ingesteld op 'inset'. Het creëert een verzonken of gedrukt uiterlijk voor de rand rond de beoogde elementen.
  5. border-width: 3px;: Met deze eigenschap wordt de randbreedte ingesteld op 3 pixels. De rand rond de elementen is 3 pixels dik.
  6. padding: 5px;: deze eigenschap voegt 5 pixels opvulling toe rond de inhoud binnen de beoogde elementen. Het biedt ruimte tussen de tekst en de rand.
  7. background-color: #FFFFFF;: Met deze eigenschap wordt de achtergrondkleur ingesteld op wit (#FFFFFF). De inhoud binnen de beoogde elementen heeft een witte achtergrond.
  8. line-height: 100%;: Met deze eigenschap wordt de lijnhoogte ingesteld op 100% van de lettergrootte. Het zorgt ervoor dat de tekstregels op een bepaalde afstand van de lettergrootte staan.
  9. margin: 10px;: Deze eigenschap voegt een marge van 10 pixels toe rond het gehele element. Het biedt ruimte tussen dit element en andere elementen op de pagina.

De meegeleverde CSS-code definieert een stijl voor HTML-paragrafen met de klasse ‘code’. Het stelt het lettertype, de lettergrootte, de randstijl, de randbreedte, de opvulling, de achtergrondkleur, de lijnhoogte en de marge voor deze alinea's in. Deze stijl kan worden toegepast op codefragmenten of vooraf opgemaakte tekst in een Blogger-bericht om ze een specifiek uiterlijk te geven.

Hier ziet u hoe het eruit zal zien:

p.code {
lettertypefamilie: Courier New;
lettergrootte: 8pt;
randstijl: inzet;
border-breedte: 3px;
padding: 5px;
achtergrondkleur: #FFFFFF;
lijnhoogte: 100%;
marge: 10px;
}

Gelukkig codering!

Douglas Karr

Douglas Karr is CMO van INZICHTEN openen en de oprichter van de Martech Zone. Douglas heeft tientallen succesvolle MarTech-startups geholpen, heeft geholpen bij het due diligence-onderzoek van meer dan $ 5 miljard aan Martech-overnames en -investeringen, en blijft bedrijven helpen bij het implementeren en automatiseren van hun verkoop- en marketingstrategieën. Douglas is een internationaal erkend expert en spreker op het gebied van digitale transformatie en MarTech. Douglas is ook een gepubliceerde auteur van een Dummie's-gids en een boek over zakelijk leiderschap.

Gerelateerde artikelen

Terug naar boven knop
Sluiten

Adblock gedetecteerd

Martech Zone kan u deze inhoud gratis aanbieden omdat we inkomsten genereren met onze site via advertentie-inkomsten, gelieerde links en sponsoring. We zouden het op prijs stellen als u uw adblocker zou verwijderen terwijl u onze site bekijkt.