how to write an html document giving information about structure of html document
Answers
<!-- This is only the body part as it becomes more than 5000 words -->
<body style="font-family: Arial ;">
<h1>Important Concepts</h1>
<div>
<h2>Lesson 1: The Basics of the Web and HTML</h2>
<div>
<p>
<b>How the Web Works</b>
</p>
<p>
The web is a bunch of computers that communicate with
each other. When a person goes to a web page like
www.google.com, their computer sends a <em>HTTP Request</em>
to a <em>server</em>. The server finds the appropriate
HTML document and sends it back to the user's computer where
a <em>web browser</em> interprets the page and displays it
on the user's screen.
</p>
</div>
<div>
<p>
<b>HTML</b>
</p>
<p>
HTML stands for <em>Hypertext Markup Language.</em> HTML
documents form the majority of the content on the web.
HTML documents contain <em>text content</em> which describes
"what you see" and <em>markup</em> which describes "how it
looks".
</p>
</div>
<div>
<p>
<b>Tags and Elements</b>
</p>
<p>
HTML documents are made of HTML <b>elements</b>. When
writing HTML, we tell browsers the type of each element
by using HTML <b>tags</b>.
</p>
</div>
<div>
<p>
<b>Inline vs Block Elements</b>
</p>
<p>
HTML elements are either <b>inline</b> or <b>block</b>.
Block elements form an "invisible box" around the
content inside of them.
</p>
</div>
</div>
<div>
<h2>Lesson 2: Creating a Structured Document with HTML</h2>
<div>
<p>
<b>Developer Tools (in the Browser)</b>
</p>
<p>
HTML elements are either <b>inline</b> or <b>block</b>.
Block elements form an "invisible box" around the
content inside of them.
</p>
</div>
<div>
<p>
<b>The "tree-like structure" of HTML</b>
</p>
<p>
The "tree-like structure" comes from the fact that HTML
elements can have other elements inside of them. You can
draw this relationship like a family tree. My mother had
multiple children. So did her mother, and so on...
<br>
In a browser, this structure shows up as a series of
nested boxes. There are boxes inside of boxes inside of
boxes, and so on...
</p>
</div>
<div>
<p>
<b>The relationship between indented HTML and boxes</b>
</p>
<p>
When you read an HTML document as <em>text</em>, you see a wave
of changing indentations going up and down the left side
of the document. The more indented an element is, the more
deeply nested it's corresponding "box" is.
</p>
</div>
<div>
<p>
<b>Text Editors (for programming)</b>
</p>
<p>
When writing code, programmers use special text editors (like
Sublime Text for example). These editors make the programmer's
life easier. For example, some text editors will automatically
generate a closing HTML tag when you write an opening tag.
</p>
</div>
</div>
</body>