Markdown und Bildausrichtung

Question

Ich erstelle eine Website, die jeden Monat Artikel zu verschiedenen Themen veröffentlicht. Es ist unkompliziert, und ich denke, die Verwendung eines Markdown-Editors (wie z.B. WMD hier bei Stack Overflow) wäre perfekt.

Allerdings brauchen sie die Möglichkeit, Bilder rechts ausgerichtet in einem bestimmten Absatz zu haben.

Ich sehe keinen Weg, das mit dem aktuellen System zu tun - ist das möglich?

Answer 1

Das Einbetten von CSS ist schlecht:

![Blumen](/blumen.jpeg)

CSS in einer anderen Datei:

img[alt=Blumen] { float: right; }

Answer 2

Noch sauberer wäre es, einfach p#given img { float: right } in das Stylesheet zu setzen oder im und in style tags zu umschließen. Dann einfach das Markdown ![Alt text](/path/to/img.jpg) verwenden.

Answer 3

    ![Buch](/images/book01.jpg)

Das Attribut markdown ermöglicht es innerhalb von Markdown.

Answer 4

Ich mochte learnvst's Antwort gerne, die Tabellen verwendet, weil sie ziemlich lesbar ist (was ein Zweck des Schreibens von Markdown ist).

Allerdings musste ich im Fall des Markdown-Parser von GitBook zusätzlich zu einer leeren Kopfzeile eine Trennlinie darunter hinzufügen, damit die Tabelle erkannt und ordnungsgemäß gerendert wird:

| - | - |
|---|---|
| Ich bin Text links | ![Blumen](/blumen.jpeg) |
| ![Blumen](/blumen.jpeg) | Ich bin Text rechts |

Trennlinien müssen mindestens drei Bindestriche --- enthalten.

Answer 5

Wenn Sie es in Python implementieren, gibt es eine Erweiterung, mit der Sie HTML-Schlüssel/Wert-Paare und Klassen-/ID-Bezeichnungen hinzufügen können. Die Syntax hierfür lautet:

![Ein Bild von einer Katze](katze.png){: style="float:right"}

Oder, wenn Inline-Styling nicht Ihr Ding ist,

![Ein Bild von einer Katze](katze.png){: .floatright}

mit einem entsprechenden Stylesheet, stylish.css:

.floatright {
    float: right;
    /* usw. */
}