Why would we want to separate small pieces of content?


#1

Question

This exercise says that <span> elements are used to “separate small pieces of content”. Why would we want to separate small pieces of content?

Answer

It’s not that we necessarily want to separate content so much as we want to “mark it up” so that we can target it more specifically. There are all kinds of reasons for targeting specific pieces of content. For example, we may wish to use CSS to style the <span> content differently than the other content of a page.


FAQ: Learn HTML Elements – Intro to HTML – Displaying Text
#3

One such example is when coding a page with more than one human language.

<html lang="en">

and in the body of the document,

<p>Capitalism is predominantly conducted in private hands with the government 
taking a <span lang="fr" title="let do">laissez faire</span> stand on most 
matters of management.</p>

CSS

span[lang="fr"] {
  font-style: italic;
  text-decoration: underline;
}

span_lang

Note the use of the title attribute to provide an English language literal translation when the text is moused over.


Span and Id tags
#4

Thanks! This kind of Q&A’s is way better to understand with examples like this.


#5

Thank you for this detailed answer.


#6

Sweet! Your explanation absolutely made my day :+1:


#7

thanks for this explanation…very good


#8

very helpful answer.thanks!


#9

MTF duuuuuuuude thanks for that example!