2013-07-16 18 views
6

Có thể đặt hình ảnh bên trong một tiêu đề bằng cách sử dụng Văn bản được cấu trúc lại không?Hình ảnh văn bản được cấu trúc lại (Nhân sư) trong tiêu đề?

Cái gì như:

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

Điều này ám như văn bản, ví dụ cú pháp hình ảnh không được phân tích cú pháp. Tôi đã không thấy bất kỳ ví dụ nào về điều này khiến tôi tin rằng điều đó có thể là không thể, nhưng có lẽ ai đó có một công việc xung quanh.

tôi dự định đầu ra định dạng HTML (do đó, một sửa đổi để CSS có nguồn gốc là có thể, mặc dù tôi muốn thay đổi nguồn RST. Đây là bởi vì tôi cũng có ý định sản lượng để pdf (latex).

Trả lời

2

với HTML và CSS có một số cách để thêm một hình ảnh đến một yếu tố mà mang lại kết quả khác nhau một cặp vợ chồng mà tôi có thể nghĩ đến là:.

  1. U se một hình ảnh thay cho bất kỳ văn bản nào. Ở đây chúng tôi giữ văn bản, nhưng gửi nó đi màn hình, vì vậy nó vẫn có thể truy cập được.

    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. Đặt một hình ảnh bên trái của văn bản (hoặc có thể dễ dàng được sang bên phải)

    h1 { 
        background: url(images/image.jpg) no-repeat top left; 
        padding-left: XXpx; 
    } 
    
  3. Sử dụng hình nền, đằng sau bất kỳ văn bản

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

Bộ chọn CSS cụ thể hơn có thể được sử dụng để chỉ nhắm mục tiêu một số tiêu đề nhất định.

Bạn có thể bao gồm tùy chỉnh CSS dễ dàng trong tài liệu reStructuredText sử dụng raw directive, như vậy:

.. raw:: html 

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

Ngoài ra, bạn có thể bao gồm stylesheets tùy chỉnh CSS từ dòng lệnh bằng cách sử dụng tùy chọn --stylesheetrst2html.py.

Về đạt được cùng với sản lượng PDF, tôi sẽ ăn cắp một phần của another one of my answers:

Rõ ràng các mục tiêu trên HTML đầu ra. Tuy nhiên, tôi đã không sử dụng rst2pdf, vì vậy không thể bình luận về cách cần sửa đổi ở trên để làm việc với chương trình này. Hy vọng rằng một người khác sẽ cung cấp một câu trả lời cho điều này. Theo như tôi biết, rst2pdf không hỗ trợ một số cascading stylesheet mechanism, vì vậy cần đơn giản (đối với ai biết cú pháp kiểu trang rst2pdf) để thêm vai trò .. raw:: pdf bổ sung và sửa đổi các kiểu danh sách ở trên.

+1

Câu trả lời thú vị! Đoạn mã tuyệt vời. Tôi sẽ thử và thử chúng với rst2pdf để xem cách xử lý mọi thứ. Tôi sẽ +10 nếu tôi có thể ... – Jzl5325

8

Tôi không thể nhận xét @ kitsu.eb câu trả lời nhưng anh ấy đúng.

Tôi nghĩ rằng có thể đạt được kết quả tốt hơn bằng cách sử dụng bí danh (ví dụ: substitutions).

Dưới đây là trích từ các tài liệu mà có thể hữu ích:

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

.. |biohazard| image:: biohazard.png 

Tôi hy vọng điều này sẽ giúp

1

này có thể đạt được bằng cách sử dụng một substitution trong tiêu đề:

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

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

đây foo chỉ là một văn bản thay thế mẫu. Nó có thể là bất cứ điều gì, nhưng không nên bắt đầu hoặc kết thúc bằng khoảng trắng.

Cú pháp thay trừu tượng như sau:

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

Như chúng ta muốn chèn một hình ảnh inline, chúng ta nên chọn image như directive type.