Welcome Guest! (App Version 3.1)

websitnero logo name

HTML Span in HTML

Overview

  • Span is an Inline Element.
  • Being Inline, multiple span tags will adjust in the same line.
  • Span tags are generally used inside paragraphs where you need to add some css styling to only a part rather than the whole text.

Span Tags

Span tags are used in HTML when you want to add some styling to a part of the content but not to all the content in some container tag.

For example there is some content in a paragraph, and you want only one or two words to have background red, but rest of all paragraph is to be rendered as it is (ie, without any changes to rest of the content) -- so in this case you may wrap that portion in a span tag and apply CSS styles.

Note: In short, Span tags are used to selectively refer to some portion of long text and apply styles to it.

<span>This is a span.</span>

Example

<head>
  <style>
    .red{background:red;}
    .yellow{background:yellow;}
  </style>
</head>
<body>
  <p>Top is a wearing <span class="red">red</span> t-shirt.</p>
  <p>Jenny is wearing <span class="yellow">yellow</span> trousers.</p>
</body>

Output:

Top is a wearing red t-shirt.

Jenny is wearing yellow trousers.

Further Reading

1. <span>

WebsiteNero is highly optimized for learning various website developing technlogies. We try our best to add maximum modules and examples to help learn the concepts clearly and vividly. We try to present all content and examples as simple as we can removing any complexity to hurdle easy understanding. We try best provide you with worthful content, but we cannot guarantee full correctness of all the content on this site. While using this website, you agree to have read and accepted all our terms of use and conditions, cookie, and privacy policy. Copyright, 2013-2018 by websitenero.com. All Rights Reserved.