Skip to content
07. Html An Introduction

icon picker
Application Based Questions

Prepared by: learnloophq@gmail.com
Last edited 10 days ago by Learn LoopHQ.

Chapter: 07. Html An Introduction

You’ve written your first HTML code in Notepad and want to see it as a web page. What steps should you take to save and then view your HTML document in a browser?
First, save the file in Notepad by going to File > Save As, giving it a name like “mypage.html” and selecting “All Files” as the type. Then, locate the saved file on your computer and double-click it; it will open in your default web browser. ​
PlantUML Diagram
You’ve created a web page with information about your favorite animal, but all the text is running together in one continuous block. How can you separate different ideas into new lines or paragraphs?
To separate different ideas into new paragraphs, use the <P> (paragraph) tag around each distinct block of text, as it automatically adds a blank line. If you only need to start a new line within the same paragraph without adding extra space, use the <BR> (line break) empty tag wherever you want the text to break. ​
PlantUML Diagram
You want to make your webpage look more interesting by changing the main title’s color, making it bold, and adding an underline. Which CSS properties would you use, and how could you apply them directly to that title?
To style the main title, you would use CSS properties like color for the text color, font-weight for boldness, and text-decoration for the underline. You can apply these directly to the title’s HTML tag (e.g., <h1>) using an inline style like: <h1 style="color: red; font-weight: bold; text-decoration: underline;">Your Title</h1>. ​
PlantUML Diagram
You have saved an HTML file, but when you double-click it, it always opens in a web browser, and you can’t edit the code. How can you open the file so you can make changes to the HTML code?
To open the HTML file for editing instead of viewing, you need to right-click on the file icon. From the context menu that appears, select the “Open with” option and then choose a plain text editor program like Notepad or Wordpad. This will open the raw HTML code, allowing you to make your desired changes. ​
PlantUML Diagram
Your teacher asked you to create a webpage with the title “My Science Project” that displays a heading for “Photosynthesis” and then another subheading “Key Steps,” both properly formatted. What HTML tags would you use for these headings to show their importance hierarchy?
For the main heading “Photosynthesis,” you would use the <h1> tag: <h1>Photosynthesis</h1>. To represent “Key Steps” as a subheading directly beneath it and show its importance hierarchy, you would use the <h2> tag: <h2>Key Steps</h2>. These tags help organize content visually and semantically. ​
PlantUML Diagram
You want to create a web page for a science class that shows the formula for water (H2O) and the formula for energy (E=mc2). Which specific HTML tags would you use to make the numbers appear correctly?
To make the numbers appear correctly as subscripts and superscripts, you would use the <sub> and <sup> tags, respectively. For the water formula (H2O), it would be H<sub>2</sub>O. For the energy formula (E=mc2), it would be E=mc<sup>2</sup>. ​
PlantUML Diagram
You want to add a visually distinct line to separate two sections of text on your webpage. Which empty HTML tag would you use for this purpose?
To add a visually distinct line that separates two sections of text on your webpage, you would use the <HR> tag. This is an empty HTML tag that creates a horizontal rule or line across the page, serving as a clear visual divider. ​
PlantUML Diagram
You have multiple web pages for your school project, and you want them all to have the same green background and white text. What is the most efficient way to apply this consistent styling across all your pages using CSS?
The most efficient way to apply consistent styling like a green background and white text across multiple web pages is by using an external style sheet. You would create a separate .css file (e.g., project.css) containing the body{background-color: green; color: white;} rule, and then link this .css file to each HTML page using the <link> tag within their respective <head> sections. ​
PlantUML Diagram
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.