Balingasa High School
LEARNING ACVITY SHEETS (LAS)
PROGRAMMING – .NET TECHNOLOGY
Name of Learner: Date:
Grade and Section: Score:
Net Technology Programming: HTML TAGS
Lesson
Learning Competency:
• Develop basic HTML document using HTML5 and CSS3 syntax. TLE_ICTP.NET 11-12PPHJCIIf-i-29
Objectives:
▪ Identify and understand the purpose of HTML text formatting tags;
▪ Apply <b>, <i>, <p>, <blockquote>, <strong>, <em>, and <address> tags correctly.
▪ Structure simple web page content using these foundational HTML elements.
INTRODUCTION
HTML (HyperText Markup Language) is the standard markup language for creating web pages. It describes the structure
of a web page semantically and originally included cues for the appearance of the document.
Understanding Basic Text Tags
HTML provides several tags to format text, giving it meaning or altering its appearance.
Tags for Text Formatting:
• <b>: Defines bold text. (No semantic importance, just style)
• <i>: Defines italic text. (No semantic importance, just style)
• <p>: Defines a paragraph. This is a block-level element.
• <blockquote>: Defines a section that is quoted from another source. Browsers usually indent blockquote elements.
• <strong>: Defines strong importance or bold text semantically. Content inside is typically displayed in bold.
• <em>: Defines emphasized text semantically. Content inside is typically displayed in italic.
• <address>: Defines contact information for the author/owner of a document or an article.
Example:
<!DOCTYPE html>
<html>
<head>
<title>HTML Tag Examples</title>
</head>
<body>
<p>This is a normal paragraph.</p>
<p>This text is <b>bold</b> and this is <i>italic</i>.</p>
<p>You can use <strong>strong importance</strong> or <em>emphasized text</em>.</p>
<blockquote>
"The only way to do great work is to love what you do." - Steve Jobs
</blockquote>
<address>
Written by: Jane Doe<br>
Visit us at: 123 Web Street, Internet City<br>
Email: [email protected]
</address>
</body>
</html>
Activity 1: Identify and Explain
Instructions: For each HTML tag below, briefly explain its purpose and how it typically appears in a web browser.
1) <p>:
2) <b>:
3) <strong>:
4) <i>:
5) <em>:
6) <blockquote>:
7) <address>:
Activity 2: Applying Basic HTML Tags: Create simple webpage content
Instructions: Create an HTML document structure (including <!DOCTYPE html>, <html>, <head>, and <body> tags) and then add
the following content within the <body> section, using the appropriate HTML tags.
1. A main heading: <h1>My Simple HTML Page</h1>
2. A paragraph describing HTML: "HTML is the standard markup language for creating Web pages."
3. A sentence where "standard markup language" is bold (using <b>).
4. A new paragraph that contains a famous quote. The quote itself should be inside a <blockquote> tag. For example: "The
future belongs to those who believe in the beauty of their dreams." - Eleanor Roosevelt
5. Within the <blockquote> tag, make "The future" strong and "beauty of their dreams" emphasized.
6. A short sentence: "This is some important information." Here, "important" should be in italic using <i>.
7. Add contact information for "Web Developer Inc." including an address (e.g., "123 Tech Drive, Silicon Valley"), phone
number (e.g., "555-123-4567"), and email (e.g., "
[email protected]"). Use the <address> tag for this block. Each
piece of information should be on a new line within the <address> tag using <br>.
Self-Check / Reflection:
1) What was the most interesting HTML tag you learned today and why?
2) How do you think the these basic tags contribute to the structure of a webpage?
