Blogger: CSS stil za kod na vašem blogu
Prijatelj me je pitao kako sam napravio regione koda u unosu na Blogger. Uradio sam to koristeći oznaku stila za CSS u mom Blogger šablonu. Evo šta sam dodao:
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
: Ovo je CSS pravilo koje cilja HTML<p>
elemenata sa imenom klase “code”. To znači da će svaki pasus s ovom klasom biti stiliziran prema sljedećim svojstvima.font-family: Courier New;
: Ovo svojstvo postavlja porodicu fontova na “Courier New”. Određuje font koji će se koristiti za tekst unutar ciljanih elemenata.font-size: 8pt;
: Ovo svojstvo postavlja veličinu fonta na 8 tačaka. Tekst unutar ciljanih elemenata bit će prikazan u ovoj veličini fonta.border-style: inset;
: Ovo svojstvo postavlja stil ivice na "umetnuti". Stvara utonuo ili pritisnut izgled ivice oko ciljanih elemenata.border-width: 3px;
: Ovo svojstvo postavlja širinu ivice na 3 piksela. Granica oko elemenata će biti debela 3 piksela.padding: 5px;
: Ovo svojstvo dodaje 5 piksela ispuna oko sadržaja unutar ciljanih elemenata. Obezbeđuje razmak između teksta i ivice.background-color: #FFFFFF;
: Ovo svojstvo postavlja boju pozadine na bijelu (#FFFFFF). Sadržaj unutar ciljanih elemenata imat će bijelu pozadinu.line-height: 100%;
: Ovo svojstvo postavlja visinu reda na 100% veličine fonta. Osigurava da su redovi teksta raspoređeni u skladu s veličinom fonta.margin: 10px;
: Ovo svojstvo dodaje marginu od 10 piksela oko cijelog elementa. Omogućuje razmak između ovog elementa i ostalih elemenata na stranici.
Dostavljeni CSS kod definira stil za HTML pasuse sa klasom “code”. Postavlja font, veličinu fonta, stil ivice, širinu ivice, padding, boju pozadine, visinu linije i margine za ove pasuse. Ovaj stil se može primijeniti na isječke koda ili unaprijed formatirani tekst u Blogger postu kako bi im se dao specifičan izgled.
Evo kako će to izgledati:
p.code {
font-family: Courier New;
veličina fonta: 8pt;
Border-style: umetnuti;
border-width: 3px;
padding: 5px;
boja pozadine: #FFFFFF;
visina linije: 100%;
marža: 10px;
}
Sretno kodiranje!