Отображение формулы на web-странице.
Недавно столкнулся с проблемой того, что очень проблематично отобразить математические (или физические) формулы на сайте (web-странице).
Пример того как у меня это получилось можно посмотреть на этом сайте.
Сразу оговорюсь, что то, как я вставил, формулы возможно покажется трудным или, так сказать, “замудренным” способом, но проще у меня не получилось.
Внимание! Если Вам цвет формулы менять не надо, то смотрите более простой способ вставки формулы на сайт в самом конце этого поста.
Итак, вначале, предполагаем что вы имеете формулу, написанную в документе Word :
Нажимаем правой кнопкой мыши на эту формулу и выбираем функцию “копировать“:
Открываем стандартную программу Windows под названием Paint:
Создаем новый документ в Paint: “Файл – Создать”
Далее нажимаем “вставить”, и формула, скопированная в ворде, у нас вставится как рисунок в Paint, затем нажимаем инструмент “прямоугольник” и формула выделится как рисунок:
После этого нажимаем “правка”, – “копировать”.
Создаем новый документ в Paint (Файл-создать), размеры создаваемого файла не изменяем, он автоматически создастся по размерам формулы. Нажимаем “вставить”, после этого сохраняем полученный рисунок на компе, допустим в папке “мои рисунки”.
Открываем этот рисунок в фотошопе (Photoshop) и нажимаем “Выделение” – “все”:
Затем нажимаем в фотошопе “Редактирование” – “Скопировать” или CTRL+C.
Создаем новый документ в фотошопе и вставляем туда только что скопированный рисунок, эта манипуляция нужна потому, что в исходном рисунке проблематично заменять цвета.
Теперь выбираем цвет заливки, который будет цветом фона формулы или, другими словами, такой же цвет как цвет фона на вашем сайте, я выберу для примера голубой фон формулы:
Выполняем заливку белого фона нашим цветом, т.е мной, например выбран голубой фон:
Выбираем инструмент “Волшебная палочка”, и нажимаем левой кнопкой мыши на голубой фон нашей формулы:
Далее нажимаем правой кнопкой мыши на выделенную область и кликаем на “Инверсия выделенной области”:
После этого выбираем цвет заливки самой формулы, допустим, на моем примере красный, и нажимаем “Редактирование”- “выполнить заливку”.
И получаем, в конце концов, нужную нам формулу с нужным цветом цифр и желаемым фоном.
Далее в фотошопе сохраняем этот рисунок “Для Web”.
И закачиваем данный рисунок на сайт, где должна быть эта формула.
Т.е. в итоге, мы преобразовали формулу документа Word в рисунок, и вставили формулу на сайт с нужным нам отображением цветов.
P.S. Эти сложные преобразования нужны только если нужно менять цвет формулы, если же цвета менять не надо, то все гораздо проще:
- Делаете принт-скрин “Print Screen” документа ворд там, где формула;
- Открываете в фотошопе сделанный скриншот с формулой;
- Вырезаете на рисунке только саму формулу;
- Создаете новый документ в фотошопе, и вставляете туда вырезанную формулу из рисунка;
- Сохраняете данный рисунок (т.е. только саму формулу) и закачиваете его себе на web-страницу сайта ( в этом случае формула будет черно белая, как в ворде).
На этом все!!! Всем удачи по вставке формул в ваши сайты:) !!!