Category:Simple images substitutable by HTML

 See also category: Diagonal bisection square flags (plain).

HTML tags, like <span>, can be used to "draw" something image-like, as squares, rectangles, even circles.

Rectangle

e.g. {{#tag:span||style=display:inline-block;width:4em;height:2em;background-color:#C9F}}

Square, with border

e.g. <span style="display:inline-block;width:2.4em;height:2.4em;background-color:#9FC;border:2px solid red"/>

Diagonal bisection ({{Legend striped}})

e.g. <span style="display:inline-block;width:0.1em;height:0em;border-left:1.5em solid #F00;border-bottom:1.51em solid #00F">

Circle, also with border

e.g. <span style="background:#FC0;border:3px solid #06F;border-radius:28px">&emsp;&nbsp;</span>     

Line examples:

e.g. {{#tag:span||style=display:inline-block;width:4.0em;height:3px;border-top:2px dashed #D00}}
e.g. {{#tag:span||style=display:inline-block;width:4.6em;height:3px;border-top:4px dotted #DD0}}