Могу ли я использовать пользовательские плагины CSS / JQuery в моем файле уценки

Я пытаюсь сделать уценку для создания заметок, и я чувствую себя ограниченным с точки зрения стилизации моих заметок и придания им стиля. Например, я хотел бы добавить блоки стиля предупреждения / информации с помощью начальной загрузки CSS. Как мне этого добиться? Я попытался добавить HTML в мой файл уценки, как показано ниже:

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js">
</head>
#Class 1

<button type="submit" class="btn btn-info">Submit</button>

Но это не похоже на работу. Я хочу сделать следующее в моем файле уценки:

  1. Добавление предупреждений в стиле начальной загрузки / комментариев / блоков предложений
  2. Размещение изображений в слайдере jQuery
  3. Размещение видео на YouTube или Vimeo в моей уценке с функциями управления воспроизведением
  4. Размещение аудиоклипа soundcloud с помощью плагина jQuery
  5. Размещение двух или более изображений рядом с текстом всплывающей подсказки

Пожалуйста, предложите, если уценка может справиться с вышеуказанным. Я искал Markdown,MultiMarkdown, Jekyll, но не смог найти ответ на мои вопросы. Как работает уценка? Могу ли я смешать HTML и уценку вместе?

Обновление: Попробовал синтаксис multimarkdown, чтобы включить css, но это, похоже, не работает. Ниже то, что я пытался

CSS: https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js

<style type="text/css"> 
 @import url("https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js");
</style>
<button type="submit" class="btn btn-default">Submit</button>
Источник

1 ответ

Я сам использовал только командную строку Linux markdown приложение, оно сделало почти именно то, что вы хотите.

Выход для команды

markdown demo > demo.html

было это:

<p><html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.1/js/bootstrap.min.js">
</head></p>

<h1>Class 1</h1>

<p><button type="submit" class="btn btn-info">Submit</button></p>

Проблема в том, что он все заключает в абзацы. Решение простое. Верхний и нижний колонтитулы должны быть отдельным HTML-файлом. Так, например, под Linux я бы сделал следующее:

  • написать файл уценки.
  • бежать markdown demo.md > demo.html
  • конкат три файла: cat header.html demo.html footer.html >> fullpage.html

Этот же принцип можно использовать для любой ОС.

Файлы верхнего и нижнего колонтитула:

Это должно идти в шапку:

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="path/to/bootstrap.min.js">
</head>
<body>

И это должно идти в нижний колонтитул:

<script type="text/javascript" src="path/to/jquery.min.js" />
</body>
</html>

Итак, предположим, что тело это просто строка уценки:

# Title

После моих шагов, описанных выше, будет достигнут следующий результат:

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="path/to/bootstrap.min.js">
</head>
<body>
<h1>Title</h1>
<script type="text/javascript" src="path/to/jquery.min.js" />
</body>
</html>
Источник
Другие вопросы по тегам