Styl CSS pro kód na vašem blogu

Jeden můj přítel se mě zeptal, jak jsem vytvořil regiony kódu v mém posledním záznamu blogu. Vlastně jsem „předstíral“ oblast kódu s využitím stylu. V Bloggeru můžete upravit svou šablonu. Přidal jsem následující styl:

p.code {font-family: Courier New; velikost písma: 8pt; hraniční styl: vložka; šířka okraje: 3px; výplň: 5px; barva pozadí: #FFFFFF; výška čáry: 100%; okraj: 10px}

Dalším krokem je úprava mé značky v režimu „Upravit Html“. Jednoduše ukážu na svůj nový styl vytvořením značky. Voila! Rozdělení stylů:

• Nastavit písmo na Courier New… vypadá jako obecný editor kódu
• Nastavte velikost písma na 8 bodů, aby vypadala správně
• Nastavte styl ohraničení odstavce na „vložený“. Toto replikuje, jak vypadá textová oblast na stránce.
• Nastavte šířku ohraničení na 2 nebo 3 pixely. Díky tomu bude styl vloženého ohraničení vypadat správně.
• Výplň nastavuje vzdálenost mezi ohraničením a textem uvnitř.
• Barva pozadí… nastavit na bílou (#FFFFFF)
• Výška řádku - Upravil jsem to na 100%, protože některé další styly v mém bloggerovém motivu způsobily, že moje výška řádku byla asi 200%
• Nastavte okraj na 10 px. Tím se odstavec (značka p) posune o 10 pixelů od všeho.

To je vše, je to taky! Jedna poznámka: Editor, který je součástí Bloggeru, není schopen zobrazit, jak se objeví ve vašem blogu. Ale funguje to a vypadá skvěle!

Ještě jedna poznámka… po provedení úpravy značky ji editor Bloggeru rád náhodně použije jinde v celém příspěvku. Je to trochu otravné! Moje rada by byla napsat celý váš příspěvek a poté ten malý upravit.

Jedna poznámka na závěr ... pro zobrazení symbolů použijte entity HTML! Pár příkladů:

• Citáty („) jsou“
• > je>
• > je>

Šťastné kódování!