Page 175 - Webapplication11_C11_Flipbook
P. 175
Output:
Welcome This content has been styled differently
than the rest of the web page by using
the <div> tag.
Hello! I am Sammy. I study in class 12.
I love to eat pizza and burgers!
I like to get up early in the morning and go for a walk.
Any kind of content can be placed inside the <div> tag!
2.9 THE <SPAN> TAG
The <span> tag is an inline container used for marking up a section of a text. It can be easily styled by using CSS or
controlled with JavaScript using the class or id attribute. The <span> tag is much like the <div> element, however, <div>
is an element at the block-level while <span> is an inline element. For example:
<html>
<body>
<h1> Me and My Sister </h1>
<p>My sister has long hair. She coloured it <span style="color: blue; font-
weight: bold;"> blue. </span>
I have <span style="color: brown; font-weight: bold;"> brown </span> hair. I
didn't colour it. </p>
</body>
</html>
Output:
Me and My Sister
My sister has long hair. She coloured it blue. I have brown hair. I didn't colour it.
Lab Assignment ‘n Activity #Experiential Learning
Let us use both tags in HTML code to further understand the difference between the two.
<html>
<head>
<title>Simple HTML Example</title>
</head>
<body>
<div style="color: red; font-weight: bold; border: 2px solid blue;">
<h1>Artificial Intelligence</h1>
<p>Artificial intelligence (AI) in its broadest definition refers to the
intelligence displayed by machines, particularly computer systems. <span
style="color: green; font-weight: bold;">It is a branch of computer science
Website Building Using HTML and CSS 173

