Styl CSS pro kód na vašem blogu

css

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í!

3 Komentáře

  1. 1
  2. 2
  3. 3

Co si myslíte?

Tyto stránky používají Akismet k omezení spamu. Zjistěte, jak jsou vaše údaje komentářů zpracovávány.