CSS стил за код във вашия блог

CSS

Един мой приятел ме попита как направих кодовите региони при последното ми влизане в блога. Всъщност „фалшифицирах“ кодовия регион, използвайки стил. В Blogger можете да редактирате вашия шаблон. Добавих следния стил:

p.code {семейство шрифтове: Courier New; размер на шрифта: 8pt; граничен стил: вложка; широчина на границата: 3px; подплата: 5px; фон-цвят: #FFFFFF; височина на линията: 100%; марж: 10px}

Следващата стъпка е да редактирам моя таг в режим „Редактиране на HTML“. Просто посочвам новия си стил, като правя етикета. Voila! Разбиване на стиловете:

  • Задайте шрифта на Courier New ... изглежда като редактор на общ код
  • Задайте размера на шрифта на 8pt, за да изглеждате правилно
  • Задайте стила на границата на абзаца на „вмъкване“. Това възпроизвежда как изглежда текстовото поле на страницата.
  • Задайте ширината на границата на 2 или 3 пиксела. Това прави стила на вградената граница да изглежда правилно.
  • Подложката определя разстоянието между границата и текста вътре.
  • Цвят на фона ... задайте го на бял (#FFFFFF)
  • Височина на линията - Настроих това на 100%, защото някои от другите стилове в темата ми на блогъра направиха височината ми на линия около 200%
  • Задайте полето на 10 px. Това премества абзаца (p tag) на 10 пиксела от всичко.

Това е всичко, нали! Една бележка: Редакторът, който се доставя с Blogger, не може да показва това, което ще се появи във вашия блог. Но работи и изглежда страхотно!

Още една бележка ... след като направите редакцията на маркера, редакторът на Blogger обича да го използва на случаен принцип другаде в публикацията ви. Малко е досадно! Моят съвет би бил да напишете цялата си публикация и след това да направите малката редакция след това.

Последна бележка ... не забравяйте да използвате HTML елементи за показване на вашите символи! Няколко примера:

  • Кавичките („) са„
  • > е>
  • > е>

Честито кодиране!

3 Коментари

  1. 1

    Просто съм любопитен да разбера дали мога да добавя емисии от новинарски сайт, така че новините да се появяват в страничната ми лента?

  2. 2
  3. 3

    нещо, че няма нужда да пиша сега от. можете да използвате полезни редактори. можете да изберете цвят, граница и т.н.

Какво мислите?

Този сайт използва Akismet за намаляване на спама. Научете как се обработват данните за коментарите ви.