Check out example codes for "what is span in html". It will help you in understanding the concepts better.

Code Example 1

The <span> tag is an inline container used to mark up a part of a text, or a part of a document.
The <span> tag is easily styled by CSS or manipulated with JavaScript using the class or id attribute.
The <span> tag is much like the <div> element, but <div> is a block-level element and <span> is an inline element.

Code Example 2

The HTML <span> element is a generic inline container for
pieces of content, which does not inherently represent anything. 
It is mostly used for grouping and styling bits of content.
<span> is very much like a <div> element, but <div> is a 
block-level element whereas a <span> is an inline element.

Code Example 3


Code Example 4

	Span is used to group inline elements.
	You can apply specific attributes to the span element
	that will only be applied to the content within.
	Below is a simple example -->
<p>Black text <span style="color:#ff0000">Red Text </span>Back to Black</p>

Code Example 5

A <span> element used to color a part of a text:
<span style="font-size:30px">&#9776; </span> 
<!-- &#9776 is a color value -->

Code Example 6

//an example of an "out of context" way to change color of a text:
<span style="color: green"></span>

Learn ReactJs, React Native from