How to Embed a CSS Span Tag
The Cascading Style Sheets (CSS) span tag gives you greater control over the look of your Web page because it enables you to style just the particular elements you want. These elements are the individual portions, such as words or characters, found in your content. For instance, you have the option to apply colors to certain words within a paragraph. Embedding a span tag consists of creating the CSS rule and applying it to the HyperText Markup Language (HTML) code. Launch your computer's text editor program and use the span tag to format your page.
Other People Are Reading
Instructions
-
-
1
Start your text editor program and open the document you want to add CSS to.
-
2
Position your cursor before the closing </head> element and type in the following CSS placeholder:
<style type="text/css">
<!--
-->
</style>
-
-
3
Enter a term of your choosing to name a class or ID, and precede this with the "span" element. For example, the class "boldtext" would appear as "span.boldtext" in the style rule.
-
4
Type your CSS declaration (the style you want to create) between a pair of curly brackets. For instance, to create a style rule for the "boldtext" class that applies a bold font, you would type:
span.boldtext { font-weight: bold; }
-
5
Enter <span class=" "> or <span id=" "> before the text you want to style and type a closing </span> tag at the end. Enter the name of your class or ID between the quotation marks of the first element. For example:
<span class="boldtext">This is bolded text on the page.</span>
-
6
Save your document. The span tag is now embedded on your Web page.
-
1
Tips & Warnings
A class is preceded by a period and styles more than one area on the page, while an ID starts with a number sign and is only applicable to one spot.
