Blogger: CSS stils kodam jūsu emuārā
Draugs man jautāja, kā es izveidoju koda reģionus Blogger ierakstā. Es to izdarīju, izmantojot CSS stila tagu savā Blogger veidnē. Lūk, ko es pievienoju:
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
: šī ir CSS kārtula, kuras mērķis ir HTML<p>
elementi ar klases nosaukumu “kods”. Tas nozīmē, ka jebkura rindkopa ar šo klasi tiks veidota atbilstoši tālāk norādītajām īpašībām.font-family: Courier New;
: šis rekvizīts iestata fontu saimi uz “Courier New”. Tas norāda fontu, kas tiks izmantots tekstam mērķa elementos.font-size: 8pt;
: šis rekvizīts iestata fonta lielumu uz 8 punktiem. Teksts atlasītajos elementos tiks parādīts šādā fonta lielumā.border-style: inset;
: šis rekvizīts iestata apmales stilu uz “ielikts”. Tas rada nogrimušu vai nospiestu izskatu apmalei ap mērķa elementiem.border-width: 3px;
: šis rekvizīts iestata apmales platumu uz 3 pikseļiem. Apmale ap elementiem būs 3 pikseļu bieza.padding: 5px;
: šis rekvizīts pievieno 5 pikseļu polsterējuma saturam atlasītajos elementos. Tas nodrošina atstarpi starp tekstu un apmali.background-color: #FFFFFF;
: šis rekvizīts iestata fona krāsu uz baltu (#FFFFFF). Mērķa elementu saturam būs balts fons.line-height: 100%;
: šis rekvizīts iestata rindas augstumu uz 100% no fonta lieluma. Tas nodrošina, ka teksta rindiņas ir izvietotas atbilstoši fonta izmēram.margin: 10px;
: šis rekvizīts visam elementam pievieno 10 pikseļu rezervi. Tas nodrošina atstarpi starp šo elementu un citiem lapas elementiem.
Norādītais CSS kods nosaka stilu HTML rindkopām ar klasi “kods”. Tas nosaka šo rindkopu fontu, fonta lielumu, apmales stilu, apmales platumu, polsterējumu, fona krāsu, līnijas augstumu un piemales. Šo stilu var lietot koda fragmentiem vai iepriekš formatētam tekstam Blogger ziņā, lai piešķirtu tiem īpašu izskatu.
Lūk, kā tas izskatīsies:
p.code {
fontu saime: Courier New;
fonta izmērs: 8pt;
apmales stils: ielaidums;
apmales platums: 3 pikseļi;
polsterējums: 5px;
fona krāsa: #FFFFFF;
līnijas augstums: 100%;
rezerve: 10px;
}
Laimīgu kodēšanu!