Texte restructuré (Sphinx) Image dans l'en-tête ?

Question

Est-il possible de placer une image à l'intérieur d'un titre à l'aide de Restructured Text ?

Quelque chose comme :

Introduction .. image:: path/to/img.png
---------------------------------------

Il s'agit d'un texte, c'est-à-dire que la syntaxe de l'image n'est pas analysée. Je n'ai pas vu d'exemples de ce type, ce qui me fait penser que ce n'est pas possible, mais peut-être que quelqu'un a une solution de contournement.

J'ai l'intention de produire un fichier HTML (une modification du CSS dérivé est donc possible, mais je préférerais modifier la source RST). En effet, j'ai également l'intention de produire un fichier pdf (latex).

Answer 1

Je pense qu'un meilleur résultat pourrait être obtenu en utilisant des alias (c.-à-d. substitutions ).

Voici un extrait de la documentation qui peut être utile :

The |biohazard| symbol must be used on containers used to
dispose of medical waste.

.. |biohazard| image:: biohazard.png

J'espère que cela vous aidera

Answer 2

Ceci peut être réalisé en utilisant un substitution dans l'en-tête :

Header Text |foo|
=================

.. |foo| image:: path/to/img.png

Aquí foo n'est qu'un exemple de texte de substitution. Il peut être quelconque, mais ne doit pas commencer ou se terminer par un espace.

La syntaxe de substitution abstraite est la suivante :

+-------+-----------------------------------------------------+
| ".. " | "|" substitution text "| " directive type "::" data |
+-------+ directive block                                     |
        |                                                     |
        +-----------------------------------------------------+

Comme nous souhaitons insérer une image en ligne, nous devons choisir l'option image en tant que directive type .

Answer 3

Avec HTML et CSS, il existe plusieurs façons d'ajouter une image à un élément, qui donnent des résultats différents. En voici quelques-unes qui me viennent à l'esprit :

1. Utiliser une image à la place d'un texte. Ici, nous conservons le texte, mais nous l'envoyons en dehors de l'écran, de sorte qu'il reste accessible.

   h1 {
       background: url(images/image.jpg) no-repeat top center;
       display: block;
       text-indent: 100%;
       white-space: nowrap;
       overflow: hidden;
       width: XXpx;
       height: XXpx;
   }

2. Placez une image à gauche du texte (ou à droite).

   h1 {
       background: url(images/image.jpg) no-repeat top left;
       padding-left: XXpx;
   }

3. Utiliser une image d'arrière-plan, derrière n'importe quel texte

   h1 {
       background:url(images/image.jpg) no-repeat top center;
   }

Des sélecteurs CSS plus spécifiques peuvent être utilisés pour cibler uniquement certains en-têtes.

Vous pouvez facilement inclure des feuilles de style CSS personnalisées dans les documents reStructuredText à l'aide de la balise raw directive comme suit :

.. raw:: html

    <style>
        <!-- One of the CSS styles above. -->
    </style>

Vous pouvez également inclure des feuilles de style CSS personnalisées à partir de la ligne de commande à l'aide de l'option --stylesheet option de rst2html.py .

Pour réaliser la même chose avec la sortie PDF, je vais voler une partie de une autre de mes réponses :

Il est évident que ce qui précède vise la sortie HTML. Cependant, je n'ai pas utilisé rst2pdf, et je ne peux donc pas dire comment modifier ce qui précède pour qu'il fonctionne avec ce programme. J'espère que quelqu'un d'autre pourra répondre à cette question. Pour autant que je sache, rst2pdf prend en charge l'option mécanisme de feuille de style en cascade Il devrait donc être simple (pour quelqu'un qui connaît la syntaxe de la feuille de style de rst2pdf) d'ajouter un élément supplémentaire .. raw:: pdf et de modifier les styles de liste ci-dessus.