Info On HTML

Printable View

  • 09-21-2006, 08:24 PM
    sign89
    Info On HTML
    Headings

    The heading structures are most commonly used to set apart document or section titles. For example, the word "Headings" at the beginning of this section is a heading. So is this document's title (it's at the top of the page, in case you somehow missed it).

    ** WARNING ** Remember that these heading structures go into the body of the document. The headings being discussed here have nothing to do with the HEAD structure from the previous chapter.

    There are six levels of headings, from Heading 1 through Heading 6. Heading 1 (H1) is "most important" and Heading 6 (H6) is "least important." By default, browsers will display the six heading levels in the same font, with the point size decreasing as the importance of the heading decreases. Here are all six HTML pairs, in descending order of importance:

    <H1>Heading 1</H1>
    <H2>Heading 2</H2>
    <H3>Heading 3</H3>
    <H4>Heading 4</H4>
    <H5>Heading 5</H5>
    <H6>Heading 6</H6>

    These six lines, when placed into an HTML document, will simply display the six levels of headings. Take a look.

    Since, as we have discussed, whitespace doesn't matter, you might think that the above block of HTML would just string the content into one line of text. However, because headings are meant for section titles and the like, they are defined as existing on a line by themselves. A heading always begins at the margin of a line and always forces a line break at the end of the heading. In other words, you cannot have two heading levels on the same line.

    This also means that you cannot highlight text in the middle of a paragraph by marking it as a heading. If you try this, the paragraph will be split in two, with the heading text on its own line between the two pieces. (Later on, we'll talk about ways of highlighting text.)

    ** ASIDE ** If you have a browser which is set close to its default settings, you'll notice that the text for the last two headings gets pretty small. This leads to some page designers using H6 for the fine print at the bottom of pages. This is a mistake, not to mention an abuse of the heading structure. As you no doubt know, many browsers allow the user to set the size of each element, including the headings. If a user sets H6 to a size of 18 point, the fine print won't be so fine any more! Remember: you cannot guarantee that your document will appear to other people exactly as it does to you.
    Paragraphs

    As you might suspect, paragraphs are quite common in Web pages. They are one of the most basic structures in HTML. If you regard a document as a collection of structures and sub-structures, you may come up with something like:

    The overall structure is a page. The page is composed of a number of sections, each of which is composed of one or more paragraphs. Each paragraph is composed of words, and each word of letters.

    Admittedly, this is a simplified way of looking at text, but it will do for our purposes. The furthest HTML goes down this progression is to the paragraph level.

    The beginning of a paragraph is marked by <P>, and the end by </P>. This tutorial is obviously filled with examples of this container, and you can look at the following example page to get a more direct idea of how the paragraph tag works.

    Let's say you want to create a paragraph. You start to wonder, "What happens if I hit return at the end of every line in the paragraph? Should I make the paragraph just one long continuous line? What if I accidentally put too many spaces between words?"

    At this point, you should once again be saying to yourself: whitespace doesn't matter. You could put each word on its own line, and the paragraph would look completely normal. In fact, no matter how much whitespace you put between words, whether returns or spacebar hits, the words will be separated by one space in a Web browser.

    Got all that? If you're not sure you completely understand, go through the section again -- or better still, try it on your own.
    Line Break

    So what if you want to end a line after a certain word, but don't want to start a new paragraph? Well, what you need is a line break, which is invoked by using the <BR> tag. This forces a line break wherever you place it in the content (that is, whatever is after the <BR> tag will start from the left margin of the next line on the screen.)

    And no, there is no </BR> tag. The line break tag is -- that's right! -- an empty tag. And when you think about it, this makes sense. The concept of a line break beginning and ending doesn't really work, since a line break is a one-shot occurrence.

    Try it yourself, or look at an example.
    Blockquote

    Blockquotes are handy for those long pieces of text which are quoted material and therefore need to be set apart and indented. That is exactly what blockquote does. For example:

    This section of text is surrounded by the blockquote tags. A blockquote can exist inside of a paragraph, and always lives on its own line (which is to say, there is an implied line break before and after the blockquote, just as with headings or paragraphs themselves).

    Blockquotes are set up as follows:

    <blockquote> ...text... </blockquote>

    Just like most other things in HTML, it's a container.

    Lists
  • 09-21-2006, 09:12 PM
    LiNuX
    Info On HTML
    that would have helped me like 10 years ago, but good tutorial lol ;D, some people can use them sometimes, like he said, all html codes have an ending except < br>

    here are some more:

    how to add hyperlink with html:
    <a href="http://www.yoursite.com">HERE</a>

    put the site where it says yoursite, and put what you want appeared as the hyper link. i this instant, the hyperlink would be the word HERE, when they click HERE, it'll take them to http://www.yoursite.com
    ALWAYS remember to put http:// in the link, or else it will not direct properly.

    you can also add ALT and Target codes. ALT -- what this does is if u hover the mouse over the hyperlink, it will say a certain thing, try it with the gamer's forum logo on top, hover ur mouse over it, it'll say gamer's forum. Target -- what this does is makes it so you choose where the hyperlink will come up, u can use _self for it to come in the same browser, or _blank where it will come out in a different browser. here is an example

    <a href="http://www.gamers-forum.com" alt="Gamer's Forum" target="_blank">HERE</a>

    here, if u hover the mouse over the hyperlink "HERE" it will say "Gamer's Forum", and if u click it, it will be a popup and will appear at another browser.


    Sign89 this was a great idea, i know many things about html, i will add more tutorials later for those in need ;D good job!
  • 09-22-2006, 05:25 AM
    Thor Erik
    Re: Info On HTML
    according to the 4.01 standard there are no artibutter "alt" or "traget" ;) (these will work, but upon validation it will fail)

    also after 4.0 there are only H1 -> H3 4,5,6 will show, but there will be no validation pass ;)
  • 09-22-2006, 03:37 PM
    Wang
    Re: Info On HTML
    nice tutorial from both of ya.
  • 09-23-2006, 07:30 PM
    Haloer2006
    Re: Info On HTML
    yup good TuT i might post one of the CSS tuts i found.. it has how to build a basic template in CSS, im going to be using it but it will have images.. this right now uses no images/tables..
    ^_^
  • 09-23-2006, 08:34 PM
    LiNuX
    Re: Info On HTML
    cool, i could use a good css tutorial, and the stuff i posted up there, i got it from my head lol, i know most of html coding, there are some stuff i dont know, i'll put up some cool tricks later when i have more time
  • 09-23-2006, 08:37 PM
    Haloer2006
    Re: Info On HTML
    ok cool..
    mu site is going to have a better template with more room for info ^_^
    Ill prob relise it with some making of it as not as good as mine ^_^
  • 09-26-2006, 06:13 PM
    sign89
    Re: Info On HTML
    cool, man.
  • 09-26-2006, 08:34 PM
    Haloer2006
    Re: Info On HTML
    did u create your own template?
  • 09-26-2006, 09:15 PM
    sign89
    Re: Info On HTML
    Quote:

    did u create your own template?
    yes.

» Site Navigation

» Home
» FAQ

» Log in

User Name:

Password:

» Recent Threads

What to Do When Your...
03-21-2024 02:49 AM
Last Post By ElliottDooks
03-21-2024 02:49 AM
Im happy I finally...
03-09-2024 09:40 PM
Last Post By BillieRona
03-09-2024 09:40 PM
How to Enable the...
02-28-2024 02:25 PM
Last Post By ElliottDooks
02-28-2024 02:25 PM

» Sponsors