Blogger: Štýl CSS pre kód na vašom blogu
Priateľ sa ma spýtal, ako som vytvoril oblasti kódu v položke Blogger. Urobil som to pomocou značky štýlu pre CSS v mojej šablóne Blogger. Tu je to, čo som pridal:
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
: Toto je pravidlo CSS, ktoré sa zameriava na HTML<p>
prvky s názvom triedy „kód“. Znamená to, že každý odsek s touto triedou bude štylizovaný podľa nasledujúcich vlastností.font-family: Courier New;
: Táto vlastnosť nastaví rodinu písiem na „Courier New“. Špecifikuje písmo, ktoré sa použije pre text v rámci cieľových prvkov.font-size: 8pt;
: Táto vlastnosť nastavuje veľkosť písma na 8 bodov. Text v rámci cieľových prvkov sa zobrazí s touto veľkosťou písma.border-style: inset;
: Táto vlastnosť nastaví štýl orámovania na „inset“. Vytvára vpadnutý alebo lisovaný vzhľad okraja okolo cieľových prvkov.border-width: 3px;
: Táto vlastnosť nastavuje šírku okraja na 3 pixely. Okraj okolo prvkov bude mať hrúbku 3 pixely.padding: 5px;
: Táto vlastnosť pridáva 5 pixelov výplne okolo obsahu vo vnútri zacielených prvkov. Poskytuje medzery medzi textom a okrajom.background-color: #FFFFFF;
: Táto vlastnosť nastavuje farbu pozadia na bielu (#FFFFFF). Obsah v rámci zacielených prvkov bude mať biele pozadie.line-height: 100%;
: Táto vlastnosť nastavuje výšku riadku na 100 % veľkosti písma. Zabezpečuje, aby boli riadky textu rozmiestnené podľa veľkosti písma.margin: 10px;
: Táto vlastnosť pridáva okolo celého prvku okraj 10 pixelov. Poskytuje medzery medzi týmto prvkom a ostatnými prvkami na stránke.
Poskytnutý kód CSS definuje štýl pre odseky HTML s triedou „code“. Nastavuje písmo, veľkosť písma, štýl okraja, šírku okraja, výplň, farbu pozadia, výšku riadku a okraj pre tieto odseky. Tento štýl možno použiť na úryvky kódu alebo vopred naformátovaný text v príspevku v službe Blogger, aby im dodal špecifický vzhľad.
Takto to bude vyzerať:
p.code {
font-family: Courier New;
veľkosť písma: 8pt;
border-style: inset;
šírka okraja: 3px;
padding: 5px;
farba pozadia: #FFFFFF;
výška riadku: 100 %;
okraj: 10px;
}
Šťastné kódovanie!