test.html

<span>&lt;svg xmlns="http://www.w3.org/2000/svg" class="railroad-diagram" width="521" height="110" viewBox="0 0 521 110"&gt;</span><del> </del><span><br/>	&lt;defs&gt;<br/>	&lt;style type="text/css"&gt;&lt;![CDATA[<br/>			svg.railroad-diagram {<br/>                stroke: rgba(0, 122, 209, 0.95);<br/>			}<br/>		svg.railroad-diagram path {<br/>				stroke-width: 2;<br/>				stroke: rgba(0, 122, 209, 0.95);<br/>				fill: rgba(0,0,0,0);<br/>			}<br/>			svg.railroad-diagram text {<br/>				font: 14px monospace;<br/>				text-anchor: middle;<br/>                stroke: black;<br/>			}<br/>			svg.railroad-diagram text.label {<br/>				text-anchor: start;<br/>			}<br/>			svg.railroad-diagram text.comment {<br/>				font: italic 12px monospace;<br/>			}<br/>			svg.railroad-diagram rect {<br/>				stroke-width: 2;<br/>				stroke: rgba(0, 122, 209, 0.95);<br/>		fill: rgba(0,0,0,0);<br/>			}<br/>		]]&gt;&lt;/style&gt;<br/>	&lt;/defs&gt;<br/><br/>&lt;g transform="translate(.5 .5)"&gt;<br/>&lt;path d="M 20 31 v 20 m 10 -20 v 20 m -10 -10 h 20.5"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M40 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M108 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M40 41h20"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M60 41h28"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M88 41h20"&gt;&lt;/path&gt;<br/>&lt;path d="M40 41a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M60 61h0"&gt;&lt;/path&gt;<br/>&lt;path d="M88 61h0"&gt;&lt;/path&gt;<br/>&lt;rect x="60" y="50" width="28" height="22" rx="10" ry="10"&gt;&lt;/rect&gt;<br/>&lt;text x="74" y="65"&gt;+&lt;/text&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M88 61a10 10 0 0 0 10 -10v0a10 10 0 0 1 10 -10"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;g&gt;<br/>&lt;path d="M108 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M288 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M108 41h20"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M128 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M268 41h0"&gt;&lt;/path&gt;<br/>&lt;rect x="128" y="30" width="140" height="22"&gt;&lt;/rect&gt;<br/>&lt;text x="198" y="45"&gt;name-start char&lt;/text&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M268 41h20"&gt;&lt;/path&gt;<br/>&lt;path d="M108 41a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M128 71h36"&gt;&lt;/path&gt;<br/>&lt;path d="M232 71h36"&gt;&lt;/path&gt;<br/>&lt;rect x="164" y="60" width="68" height="22"&gt;&lt;/rect&gt;<br/>&lt;text x="198" y="75"&gt;escape&lt;/text&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M268 71a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;g&gt;<br/>&lt;path d="M288 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M480 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M288 41a10 10 0 0 0 10 -10v0a10 10 0 0 1 10 -10"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M308 21h152"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M460 21a10 10 0 0 1 10 10v0a10 10 0 0 0 10 10"&gt;&lt;/path&gt;<br/>&lt;path d="M288 41h20"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M308 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M460 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M308 41h10"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M318 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M450 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M318 41h20"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M338 41h0"&gt;&lt;/path&gt;<br/>&lt;path d="M430 41h0"&gt;&lt;/path&gt;<br/>&lt;rect x="338" y="30" width="92" height="22"&gt;&lt;/rect&gt;<br/>&lt;text x="384" y="45"&gt;name char&lt;/text&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M430 41h20"&gt;&lt;/path&gt;<br/>&lt;path d="M318 41a10 10 0 0 1 10 10v10a10 10 0 0 0 10 10"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M338 71h12"&gt;&lt;/path&gt;<br/>&lt;path d="M418 71h12"&gt;&lt;/path&gt;<br/>&lt;rect x="350" y="60" width="68" height="22"&gt;&lt;/rect&gt;<br/>&lt;text x="384" y="75"&gt;escape&lt;/text&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M430 71a10 10 0 0 0 10 -10v-10a10 10 0 0 1 10 -10"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M450 41h10"&gt;&lt;/path&gt;<br/>&lt;path d="M318 41a10 10 0 0 0 -10 10v29a10 10 0 0 0 10 10"&gt;&lt;/path&gt;<br/>&lt;g&gt;<br/>&lt;path d="M318 90h132"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M450 90a10 10 0 0 0 10 -10v-29a10 10 0 0 0 -10 -10"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M460 41h20"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;path d="M 480 41 h 20 m -10 -10 v 20 m 10 -20 v 20"&gt;&lt;/path&gt;<br/>&lt;/g&gt;<br/>&lt;/svg&gt;<br/></span>