Добавить в корзинуПозвонить
Найти в Дзене
Властелин машин

Интеграция HTML в Jupyter

Markdown ячейки в Jupyter позволяют отображать html теги. Рассмотрим наиболее распространенные способы, как навести красоту в вашем ноутбуке, используя эту особенность. Курсив Задается тегом <em>: <em>курсив</em> напомню, что существует и родной для Markdown способ указания курсива - обособляя текст символами ** Жирный текст Для оформления в html имеется тег <strong>: <strong>жирный</strong> Альтернатива в Markdown - **текст** Перевод строки Используйте тег <br>: перевод<br>строки Размер текста В теге <font> воспользуйтесь параметром size: <font size=5> Красный текст - 5 </font> Цвет текста В том же <font> задайте параметр color: <font color="red"> Красный текст </font> Bootstrap оповещения Используются для цветового оформления текста в зависимости от класса оповещений. Для этого текст заключается в тег <div> с параметром class и значениями, например: "alert alert-success", "alert alert-danger", "alert alert-warning", "alert alert-info": <div class="alert alert-success">
Все отлично
<
Оглавление

Markdown ячейки в Jupyter позволяют отображать html теги. Рассмотрим наиболее распространенные способы, как навести красоту в вашем ноутбуке, используя эту особенность.

Курсив

Задается тегом <em>:

<em>курсив</em>

напомню, что существует и родной для Markdown способ указания курсива - обособляя текст символами **

Жирный текст

Для оформления в html имеется тег <strong>:

<strong>жирный</strong>
-2

Альтернатива в Markdown - **текст**

Перевод строки

Используйте тег <br>:

перевод<br>строки
-3

Размер текста

В теге <font> воспользуйтесь параметром size:

<font size=5> Красный текст - 5 </font>
-4

Цвет текста

В том же <font> задайте параметр color:

<font color="red"> Красный текст </font>
-5

Bootstrap оповещения

Используются для цветового оформления текста в зависимости от класса оповещений. Для этого текст заключается в тег <div> с параметром class и значениями, например: "alert alert-success", "alert alert-danger", "alert alert-warning", "alert alert-info":

<div class="alert alert-success">
Все отлично
</div>

<div class="alert alert-danger">
Осторожно
</div>

<div class='alert alert-warning'>
Предупреждение
</div>

<div class='alert alert-info'>
Для информации
</div>
-6

Картинки

Для этого используйте тег <img>:

<img src='data/картинки/kartinki-ryabchiki-28.jpeg' width=320, heigth=240>
-7

-8