All pastes #1445521 Raw Edit

CliffNoteHTML

public text v1 · immutable
#1445521 ·published 2009-06-02 22:58 UTC
rendered paste body
--This is a journey into HTML.  It is the beginning for me and along the way of learning I am taking notes.  I figured that its no different then a student who shares their notes with someone who doesn't quite understand all that is going on and is more helpful to get help from someone who can explain to them on their on terms.  Now not everyone thinks the way I do, so if their is any confusion, my suggestion go learn it on your own.  My notes are more like a reminder, of keeping track of the most important things to remember, almost like preparing for a test. In the end it really is a test because by the time you have covered the material, gone over notes, you and I should be ready to use HTML.  I have already covered the basics in a previous post of understanding what HTML is and how to get started.  By request I have been asked to continue on and so these notes are in regards to HTML Elements or as I like to put it the nuts and bolts.  I want to thank w3schools.com, since I will reference them quite a bit and my information is indicated by the --.  

Quick Basics:

--<p>This is my first paragraph</p>--

--The above example is html.  The symbols you see </>, and there are lots more, are like morse code for a computer, telling it where to start, stop and so forth.  The lower case letters are tags which represent a word.  You can pretty much guess what "p" stands for. Paragraph, it stands for paragraph.

--So if you wanted to write "<p>This is my first paragraph</p>" out in a way that a human understands it would read like this:
--"Start paragraph next This is my first paragraph next end paragraph stop." hehe telegram service from MsJeeves
     <    p      >      This is my first paragraph <     /  p          >  --make sense now I hope, moving on...

The Elements

--Using the same example above I can begin to explain HTML elements. Elements are like the cream filling to a ho-ho. YUM!!!  The cream is in the center of the little cake.  Sorry, I am hungry while writing this.  Still keep in mind the ho-ho.

--<p>This is my first paragraph</p>  This line of HTML is called the "element" or the cream filling. I write all this while eating my ho-ho.
--The ho-ho part is your page, apply the cream, and you have a tasty treat or a really cool webpage.
--Each element has a tag. For instance "<p>" is the pragraph element.
--I insist that if you have time you learn or atleast make a list of all the tags, what they mean, do, and then you should have elements down.

--What ever you put between "<p>" and "</p>" or any other tags is what you are telling the browser to display with in limitations. In other words, the browser knows that a paragraph is beginning and that it needs to display what ever comes after the tag and once it has done that it ends and finds the next element. Do not get confused, think of your browser on constant repeat.  It will continue to read the html of a web page until you close it.  So while you are looking at those wonderful myspace pages, your browser is seeing the html, following the morse code, and displaying the elements, until you close it.  So tell your friends who have that black mail photo online you are on your way to learning how to get it and past their face on it instead, evil me.

HTML Element Syntax, Nested HTML Elements, and Empty HTML Elements???

--HTML Element Syntax is the way in which the browser reads. It speaks in html, and it reads html in a certain order, this order is how everything comes together and your page is displayed properly.

--Nested HTML Elements are elements within an element for example a nest with eggs in it. 
                 --<p>This is<br/>my<br/>first paragraph</p> --the <p> element is the nest

--Do you see the <br/>?  This is the break element, which starts a new line for you but doesn't start a new paragraph, it is the eggs in the paragraph element nest.  Translated into a sentence it reads:     "start paragraph next This is next break end next (start new line)
							 my next break end next(start new line)
							 first paragraph next end paragraph stop" By reading it this way you are also seeing the syntax.

--An Empty HTML element is a tag that has no end "<br>". You notice the "/" is missing.  This changes the meaning of the tag, instead of starting a new line it is now a space in the line.  With advances in other web page languages most browsers will not recognize <br> and will display improperly. So your tag elements that are singular instead of in pairs should always have the "/" written to it.  If you don't know what I mean by pairs, this is a pair of tag elements <p> and </p>.  

--A little off subject but very important to understand.  The "/" has to be placed in the right spot of your singular tags or again your page will not display properly. For instance if you put the "/" in front of "br" like this </br> then how the browser reads it as follow "start end break stop." It makes no sense. When what you want is the browser to start, break,end,  and then stop. Thus is why the "/" should always come after the letters in a singular tag.  Oh and all letters are lower cased never capitalized because it is much faster to write html if you don't have to worry about upper and lower case letters.

--Got it? Good...  I understand how some people feel when learning something new or for refreshment, it is frustrating at times, and is nice to know that there is someone out there who takes what seems very difficult and can make it so you understand.  Hopefully I will help everyone do HTML. In the end I hope to have a great page put together where there I will post all my notes on how I did it and helped others do it too.

*MsJeeves*