Newbie needing assistance


#1

Hello community, I am a newbie here learning world development. However, for my first exercise, I was told to complete this following task.
After your declaration, add opening () and closing () tags.
For anyone is has already gone through this path before, I am sure that you are aware that these exercises come in numbers.
The number two of this exercise already required that I should insert in . While number 2 is requesting that I " add opening () and closing () tags." after I ave made the html declaration.
However, my question is I'm I supposed to "add opening () and closing () tags" beneath the html declaration, or right beside it?

Your help will be appreciated.


#2

In technical speak. the terms used are,

OPENTAG

and,

ENDTAG

From its inception, Standard General Markup Language has used the left carat and right carat as container characters for element selectors, which were early on nicknamed, tags.

Fast forward, HTML elements are representations of page content according to how it is structured. Typical page content will include headings, paragraphs, lists and images. Early on it was discovered that these elements are difficult to work with on their own, and thus it was determined that container elements were needed. We have divisions and list containers to carry on that role.

Most beginner courses will start with the following on the blackboard:

<html>
<p>Hello World</p>
</html>

A browser will render this to the screen in the default typeface and character size. Unseen are all the built in default presentation rules, called style sheets that play a role in the background.

There is a lot of information behind the simple markup above, not the least of which is the discussion of tags and elements. There is a difference, but the two terms are married and joined at the hip, just not synonymous.

<p>   =>  OPENTAG declaring a paragraph TYPE element
</p>  =>  ENDTAG declaring point to stop rendering this element TYPE

 <p></p>  =>  An empty paragraph element

Now that we have covered some of the minutia and general terminology we can get to your actual question...

For readability, below, more importanlty between OPEN and END. <html></html> is the root element that houses the entire document. There is only one in any one page. For production on a mass distribution network (the WWW) specialized software removes all whitespace to reduce the byte size of the file and facilitate faster transfer across networks.

Again, in simplest form,

<html><p>Hello World</p></html>

is perfectly valid and will render with no issues. HTML is not dependent upon white space (leading, trailing spaces and line breaks) to aide in parsing the document into the DOM. Elements get their own nodes and their ogranization in the source document is of no concern. As you will learn, only their structure has any bearing.

However, when writing in creation and development mode, lots of white space, in the form of line breaks, indentation and comments go a long way toward furthering the ideas of the developer and help us to read our code months or years later. These concerns will come up as you progress.

<html>
<head>
    <title>Hello World</title>
</head>
<body>
    <p>Happy Coding!</p>
</body>
</html>

#3

thank you so much for your replying. It was helpful.


#4

Correction...

Their organization goes to structure. White space is largely ignored. The real objective is nesting. That is what defines structure of the inner elements, those not direct children of <body>.


#5

As extention to @mtf article

you have to understand the concept....

It all start's with you,
using a Browser
in which you load a HTML-file,
which we will call the HTML-Document.

This document has a minimal build of


<!DOCTYPE html>
  <html>
     <head>
          <title> </title>
     </head>
     <body>
       <!-- here you insert your HTML-code -->
     </body>
  </html>

The Browser =load's= this document into Memory
in a pattern that is described as
the Document Object Model
in short the DOM.
( the interpretation of the DOM is Browser & Version specific )

            html
             |
       +-----+------+
       |            |
     head          body
       |
     title

In the description of your document in DOM-talk...
you will encounter terms like:
parent children sibling descendants ascendants...

The HTML-Element has no parent
but is a parent to 2 child-Element's
the 'head'-Element
and
the 'body'-Element.

The 'head'- and 'body'-Element,
both being children to the 'html'-Element
are siblings to each-other.

The 'head'-Element is parent to the 'title'-Element...
the 'title'-Element is a child of the 'head'-Element
the 'title'-Element is also a descendant of the 'html'-Element.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style

The DOM has several interface's
over which you can access the data**/**information
held by the DOM.

One of the interface's is the Element-interface
you can divide the interface into
properties ( consisting of a property-key and it's associated VALUE )
and
methods ( giving you the functionality to manipulate the Elements )
https://developer.mozilla.org/en-US/docs/Web/HTML/Element
https://developer.mozilla.org/en-US/docs/Web/API/Element
https://developer.mozilla.org/en-US/Learn/HTML/HTML_tags


#6

I still stress the understaninding of.

<html><p>Hello World</p></html>

Grasp that and half the work is done. I mean, really grasp it.

We can give the browser a page like this,

<p>Hello World</p>

and it will render, only because the defacto SGML language is recognized. The browser fills in the missing <html></html> tags. The text content will render according to the default style rules (possibly set by the user) of the browser.


#7

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.