E) Ranjit a student of class 10 has been allocated a duty to perform a workshop on creation of
web page for class 8 students.
a. Before starting the workshop name the two software he requires to keep it at hand with respect
to:
i. Writing the HTML code.
ii. Seeing the output of the HTML code.
b. State the extension that is to be given to the HTML code during saving.
c. State any one procedure of executing the HTML code.
Answers
Answer:
i. For Writing the HTML code --> you can use notepad
ii. For Seeing the output of the HTML code --> you can use any one browser like google chrome, internet explorer, etc.
b) extension will be dot HTML (.html)
c) after saving the code as .html jus double click on it
Answer:
Writing HTML is Like Making Sandwiches
We are now ready to begin the actual structure of our page. Begin by adding the following code to your document, directly below our last piece of code:
1<html>
2
3</html>
The start-tag <html> tells the web browser that we want to begin our document; similarly the end-tag </html> tells the browser we want to end our document. If our page is a sandwich, the <html> start and end tags are the slabs of bread.
Before we can add any exciting content to our page, there is one more element we must add. Insert the following code directly beneath the <html> start tag:
1<body>
2
3</body>
The <body> element signifies the portion of our document that will house our actual content (paragraphs, images, etc…). You may be thinking “But I thought that’s what the <html> tags did?” In fact, the <html> element houses everything, both our actual content (which goes inside the <body> element) and more complex elements that we will learn about in future lessons. For now, just know that the <body> element goes inside the <html> element.
This is what your document should look like so far:
1<!DOCTYPE html>
2
3<html>
4 <body>
5 </body>
6</html>
Finally, The Fun Part
Now, let’s add our first bit of content to our page! How about a big bold heading? Add the following code underneath the <body> start tag:
1<h1>This is a big bold heading</h1>
This code raises a good question for the beginning coder: “How am I supposed to know what element to use? How did you decide on using the <h1> tag?”
We decided to use the <h1> element to describe our heading because this is the most important (and only) heading on our page. In future lessons we will create pages with multiple headings and utilize <h1>, <h2>, and <h3> tags to create a hierarchy of importance for our content.
Russian Stacking Dolls
At this point, it is helpful to think of HTML as a set of Russian stacking dolls. Smaller elements fit inside larger elements, which fit inside even larger elements, etc… Our header rests inside our <body> element, which rests inside our <html> element. To fully illustrate this point, let’s add a bulleted list to our page. Add the following code directly beneath your </h1> end tag: