Add picture of a basic pinyin example (#641)

index.html

@@ -1829,9 +1829,19 @@ <h5>
 
         <ol>
           <li id="id135">
+            <div>
             <p its-locale-filter-list="en" lang="en"> Romanization is only available in horizontal writing mode. These phonetic annotations are usually placed on top of the base text. Regardless of the length of the base text and the phonetic annotations, the annotations should set solid and center-aligned with the basic text.</p>
             <p its-locale-filter-list="zh-hans" lang="zh-hans">仅横排。注文通常置于基文上方。不论两者宽窄关系如何，注文应密排，并与基文居中对齐。</p>
             <p its-locale-filter-list="zh-hant" lang="zh-hant">僅橫排。注文通常置於基文上方。不論二者寬窄關系如何，注文應密排，並與基文居中對齊。</p>
+            </div>
+            <figure>
+              <img width="400" alt="Romanized interlinear annotations" src="images/en/romanization-basic.png">
+              <figcaption>
+                <span its-locale-filter-list="en" lang="en">Example of Romanized interlinear annotations.</span>
+                <span its-locale-filter-list="zh-hans" lang="zh-hans">罗马拼音标音的示例。</span>
+                <span its-locale-filter-list="zh-hant" lang="zh-hant">羅馬拼音標音的示例。</span>
+              </figcaption>
+            </figure>
           </li>
           <li id="id136">
             <p its-locale-filter-list="en" lang="en"> In special cases where Romanization is needed in vertical writing mode, the annotations are usually set to the right side of their corresponding base text, but it is difficult to read anyway.</p>