Jump to content
xisto Community
Propeng

Want-to-start Html Tutorials An HTML tutorial that covers the basics

By Propeng, in General Discussion

Advanced Composing  

7 members have voted

You do not have permission to vote in this poll, or see the poll results. Please sign in or register to vote in this poll.

Recommended Posts

Propeng    0

Propeng
Posted

NOTE: Don't use a rich text editor* for writing HTML code! Use Notepad in Windows, SimpleText in Mac or TextEdit in OSX, but you must set the following preferences for the HTML code to work!



  • In the Format menu, select Plain Text.
  • Open the preferences window from the Text Edit menu, then select "Ignore rich text commands in HTML files."
[hr=noshade]Start Creating Your Own HTML File

You can either use HTM or HTML file extensions. For more information, visit: http://filext.com/file-extension/htm/ for HTM or http://filext.com/file-extension/html/ for HTML.

Open your text editor, then type:

<html><head>
<title>127.0.0.1 - My Test Page</title>
</head>
<body>
This is a test <b>H</b> <i>T</i> <u>M</u> <s>L</s>!
</body>
</html>

Save the HTML file as "test.html". In your browser, click "Open..." under the File menu. Select the file you've just saved, then click OK. The browser will display:

This is a test H T M L!

Firstly, the <html> tag tells your browser that this is the start of the page. The text between the <head> and the </head> tags is the header information that will be displayed in your browser. The text in the <title> and the </title> tags is the title of your page. The text between the <body> and the </body> tags is the main content of your web page. The rest of the tags are displayed in the next section.[/hr][hr=noshade]Basic Tags
There are lots of tags in HTML, but we'll only cover the basic ones now.

<b> - Bold
<i> - Italic
<u> - Underline
<s> - Strikeout
<br /> - HTML doesn't preserve line breaks in code, so this tag is used to insert a line break. There's no closing tag for it.
<del> - Same as Strikeout. Old browsers will ignore this tag.
<ins> - Same as Underline. Old browsers will ignore this tag.
<hr /> - Displays a horizontal rule. There's no closing tag for it.
<p> - A paragraph. (Usually put around a long block of text.)
<font> Tag
The <font> tag is used to set the font type and size of a text. It has two normal arguments which can be used all of them or one only. They are face="" and size="". The face argument is used to set the font type & the size argument is used to set the font size. The unset text is Times New Roman with font size 3.

Headers
In HTML, there are some pre-configured headers to use. Use numbers from 1 to 6, for example:

<h1>This is a header</h1>
<b><font size="6">This is another header</font></b>

There's no difference between the two lines. But in the first line, the <h1> tag is used. In the second line, the <font> and the <b> tag is used manually to set the size.[/hr]

To be continued...

Share this post

Link to post
Share on other sites

truefusion    3

truefusion
Posted

There's no difference between the two lines. But in the first line, the <h1> tag is used. In the second line, the <font> and the <b> tag is used manually to set the size.

Actually, there is. Some browsers, if not all, place a pre-defined margin or padding in headings, while in font elements there is none unless otherwise specified by the designer or coder.

 

Check it out: 

<h1>heading</h1>
some text.
<p>
<b><font size="6">This is another header</font></b><br/>
some text
</p>

Share this post

Link to post
Share on other sites

rvalkass    5

rvalkass
Posted

The tags <b> and <i> should also no longer be used. It is much better to use <strong> and <em> as they are more semantically correct and are better understood by all browsers (text based, screen readers, and other such things). Bold and italics are not always used for strength and emphasis, and could therefore get ignored if they cannot be displayed.

You also need a DOCTYPE declaration at the start of all HTML documents:
 


That way, all browsers should interpret your code correctly, as long as the browser has been written to follow the standards right.


Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Go To Topic Listing
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.

  I accept