Blogger: CSS-styl vir kode op jou blog
'n Vriend het my gevra hoe ek die kodestreke in Blogger-inskrywing gemaak het. Ek het dit gedoen deur 'n stylmerker vir CSS in my Blogger-sjabloon te gebruik. Hier is wat ek bygevoeg het:
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;
}
p.code
: Dit is 'n CSS-reël wat HTML teiken<p>
elemente met die klasnaam "kode." Dit beteken dat enige paragraaf met hierdie klas volgens die volgende eienskappe gestileer sal word.font-family: Courier New;
: Hierdie eienskap stel die fontfamilie op "Courier New." Dit spesifiseer die lettertipe wat vir die teks binne die geteikende elemente gebruik sal word.font-size: 8pt;
: Hierdie eienskap stel die lettergrootte op 8 punte. Die teks binne die geteikende elemente sal by hierdie lettergrootte vertoon word.border-style: inset;
: Hierdie eienskap stel die randstyl op "inset." Dit skep 'n versonke of gedrukte voorkoms vir die rand rondom die geteikende elemente.border-width: 3px;
: Hierdie eienskap stel die grenswydte op 3 pixels. Die rand rondom die elemente sal 3 pixels dik wees.padding: 5px;
: Hierdie eienskap voeg 5 pixels van vulling by om die inhoud binne die geteikende elemente. Dit verskaf spasiëring tussen die teks en die rand.background-color: #FFFFFF;
: Hierdie eienskap stel die agtergrondkleur op wit (#FFFFFF). Die inhoud binne die geteikende elemente sal 'n wit agtergrond hê.line-height: 100%;
: Hierdie eienskap stel die lynhoogte op 100% van die lettergrootte. Dit verseker dat die teksreëls volgens die lettergrootte gespasieer is.margin: 10px;
: Hierdie eienskap voeg 'n marge van 10 pixels by om die hele element. Dit verskaf spasiëring tussen hierdie element en ander elemente op die bladsy.
Die verskafde CSS-kode definieer 'n styl vir HTML-paragrawe met die klas "kode." Dit stel die lettertipe, lettergrootte, randstyl, randwydte, opvulling, agtergrondkleur, lynhoogte en kantlyn vir hierdie paragrawe. Hierdie styl kan toegepas word op kodebrokkies of voorafgeformateerde teks in 'n Blogger-plasing om hulle 'n spesifieke voorkoms te gee.
Hier is hoe dit sal lyk:
p.kode {
font-familie: Courier Nuut;
lettergrootte: 8pt;
grens-styl: inlas;
randwydte: 3px;
opvulling: 5px;
agtergrond-kleur: #FFFFFF;
lynhoogte: 100%;
marge: 10px;
}
Gelukkige kodering!