head tag

Details
Category: Bacis Html
Hits: 1309

Page information.
Elements inside <head> can include scripts, instruct the browser where to find style sheets, provide meta information, and more.
The following tags can be added to the head section: <base>, <link>, <meta>, <script>, <style>, and <title>.
The <title> tag defines the title of the document, and is the only required element in the head section!

Eample

<html>
<head>
<title></title>
</head>

Elements that can be used inside a <head> element:
Tag Description
<head>

Information about the document. <head> element represents a collection of metadata about the document, including links to or definitions of scripts and style sheets.

<!-- Defining the charset in HTML4 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<!-- In HTML5 -->
<meta charset="utf-8">

<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3;url=http://www.yoursite.com/"
<title>

Title of the document

<title>Elements that can be used inside a <head> element:</title>
<base>

Specifies the base URL to use for all relative URLs contained within a document.

<base href="http://www.yoursite.com/">
<base target="_blank" href="http://www.yoursite.com/">
<link>

Relationships between the current document and other documents.

<link href="/default.css" rel="stylesheet" type="text/css" title="Default Style">
<link href="/fancy.css" rel="alternate stylesheet" type="text/css" title="Fancy">
<link href="/basic.css" rel="alternate stylesheet" type="text/css" title="Basic">
<meta>

Metadata about an HTML document

<!-- Defining the charset in HTML4 -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<!-- In HTML5 -->
<meta charset="utf-8">

<!-- Redirect page after 3 seconds -->
<meta http-equiv="refresh" content="3;url=http://www.coolsite.com/">
<script>

Defines a client-side script

<!-- HTML4 and (x)HTML -->
<script type="text/javascript" src="/javascript.js">

<!-- HTML5 -->
<script src="/javascript.js"></script>
<style>

Defines style information for a document

<style type="text/css">
body {
color:red;
}
</style>

html tag

Details
Category: Bacis Html
Hits: 2312

Html

<html> </html> These tell the browser this page is in Hypertext Markup Language.
Standard opening and closing tags for any HTML page. Enclose everything else in these.

Example
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>

title tag

Details
Category: Bacis Html
Hits: 1070

<title></title>

Title of your page
Whatever is between these tags will appear in the bar at the top of the screen.
Title goes between the head tag.

Example
<html>
<head>

<title>Title of the document</title>


</head>

body tag

Details
Category: Bacis Html
Hits: 1149

body Tags

The BODY tag follows the HEAD tag within your HTML.
Everything visible on your page goes between these tags
The body element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc.

Code example below

<html>
<head>
<title></title>
</head>
<body>
</body>
</html>


Background and Text Colors:
<body bgcolor="#FFFFFF" text="#000000">
Image Background:
<body background="/yourimage.gif">
Link Colors:
<body alink="#0000FF" link="#0000C0" vlink="#FF0000">

<body> Tag Attributes
bgcolor="color"
text="color"
link="color"
alink="color"
vlink="color"
background="image.gif"

<body bgcolor="black" text="red" link="yellow" alink="orange" vlink="white" background="image.gif">

p tag

Details
Category: Bacis Html
Hits: 1343

<p></p>

Paragraphs
The p tag defines a paragraph.
Paragraph in Html are slippery things in the beginning
<P> tag is a one-sided tag. There is no corresponding </p>
The <P> tag was used to indicate the end of a paragraph not the beginning
Later version we have a two sided <p></p>
Also th closing </P>is optional.

The paragraph element that can be contained inside the elements
"address", "applet", "blockquote", "body", "button",
"center", "del", "dd", "div", "fieldset", "form", "iframe",
"ins", "li", "map", "noframes", "noscript", "object", "td", and "th".

p ---element represents a paragraph. <p></p>


<html>
<head>
<title></title>
</head>
<body>
<p>This is a Paragraph</p>
<p>This is a Paragraph</p>
</body>
</html>

Heading

Details
Category: Bacis Html
Hits: 1011

Heading tags

The <h1> to <h6> tags are used to define HTML headings.

The numbers indicate heading levels (H1 through H6)

Heading are used to divide section of text.

The numbers indicate heading levels (H1 through H6)

Heading are used to divide section of text.

The numbers indicate heading levels (H1 through H6)




Code example below
<h1>Heading</h1>
<h2>Heading</h2>
<h3>Heading</h3>
<h4>Heading</h4>
<h5>Heading</h5>
<h6>Heading</h6>

Comments

Details
Category: Bacis Html
Hits: 1153

Comments

The comment tag is used to insert a comment in the source code. A comment will be ignored by the browser.
You can use comments to explain your code, which can help you when you edit the source code at a later date.
You can also store program-specific information inside comments. In this case they will not be visible for the user,
but they are still available to the program.
A good practice is to comment the text inside scripts and style elements to prevent older browsers,
that do not support scripting or styles, from showing it as plain text.


Comments Code example below
/* A single line comment */

/*
A comment
which stretches
over several
lines
*/

Link A tag

Details
Category: Bacis Html
Hits: 1164

<a></a>

To Create a link you use <a>...</a>tags
It has extra information inside<a>href</a> called attributes.
<a href="/../html/default.aspx"><font color="maroon"></font>
<img src="/../Images/arrow-back_32.png" /></a>

You have links that links within your web page documents.
<a href="/../html/default.aspx">Home</a>

You have links that links to other web pages on the internet.
<a href="http://www.grants-web.com/">Link to Grants-web</a>
</p>


Link Code Example
Within your Web Pages
<a href="/../html/default.aspx">Home</a>

External Link
<a href="http://www.grants-web.com/">home</a>

Order Lists Tags

Details
Category: Bacis Html
Hits: 999

Order Lists Tags

To Create a Numbered List you use Order List <OL></OL> tags and within <OL></OL> tags the list begins with <LI>tag is a one sided tag.
Example of Number list below.

  1. list number 1
  2. list number 2
  3. list number 3


Number list code
<OL>
<LI> enter text here
<LI> enter text here
<LI> enter test here
</OL>

Unordered Lists Tags

Unordered lists look just like ordered lists, except that the list use<UL></UL>tags.
Elements of the list is <LI>just as with ordered list

  • unordered list
  • unordered list
  • unordered list



Bullets example
<ul>
<li> unordered list
<li> unordered list
<li> unordered list
</ul>

Menu Lists Tags

Menu list tags <menu></menu>tags

Contents: One or more <LI>tags

<menu type="toolbar">
<li>
<menu label="File">
<button type="button" onclick="new()">New...</button>
<button type="button" onclick="save()">Save...</button>
</menu>
</li>
<li>
<menu label="Edit">
<button type="button" onclick="cut()">Cut...</button>
<button type="button" onclick="copy()">Copy...</button>
<button type="button" onclick="paste()">Paste...</button>
</menu>
</li>
</menu>

    •




    Definition Lists Tags

    Definiton list tags: <dl></dl> tags

    Contents: <DT> for the term and <DD> for definition.

    Example

    star·ling
    Any of various Old World passerine birds of the family Sturnidae, characteristically having a short tail, pointed wings, and dark, often iridescent plumage, especially Sturnus vulgaris, widely naturalized in North America.
    pel·i·can
    Any of various large, web-footed birds of the genus Pelecanus of tropical and warm regions, having a long straight bill from which hangs a distensible pouch of skin for catching and holding fish.
    il·e·i·tis
    Inflammation of the ileum.


    Definition example code below.
    <dl>
    <dt>star·ling</dt>

    <dd>Any of various Old World passerine birds of the family Sturnidae, characteristically having a short tail, pointed wings, and dark, often iridescent plumage, especially Sturnus vulgaris, widely naturalized in North America.</dd>


    <dt>pel·i·can</dt>

    <dd>Any of various large, web-footed birds of the genus Pelecanus of tropical and warm regions, having a long straight bill from which hangs a distensible pouch of skin for catching and holding fish.</dd>


    <dt>il·e·i·tis</dt>

    <dd>Inflammation of the ileum.</dd>
    </dl>

    Character Styles.

    Details
    Category: Bacis Html
    Hits: 1141


    Two kind of Character Styles. Logical Styles tags and Physical Styles tags.

    Logical Styles

    <em></em> emphasized in some way

    In HTML 5, what was previously called block-level content is now called flow content.


    <strong></strong> emphasized boldface

    When doing x it is imperative to do y before proceeding.


    <code></code> a fixed-width font as Courier

    Regular text. This is code. Regular text.


    <samp></samp> similar to <code>

    Regular text.This is sample text.Regular text.


    <kbd></kbd> text intended to be typed by a user

    Type the following in the Run dialog: cmd
    Then click the OK button.


    <var></var> the name of a variable

    A simple equation: x = y + 2


    <dfn></dfn> highlights a word or phrase

    The Internet is a global system of interconnected networks that use the Internet Protocol Suite (TCP/IP) to serve billions of users worldwide.

    WWW
    The World-Wide Web (WWW) is a system of interlinked hypertext documents accessed on the Internet.


    <cite></cite> a citation

    More information can be found in [ISO-0000]


    Physical Styles


    <b></b> for bold


    <i></i> for italic


    <u></u> for underlining



    Code example below


    <b></b>


    <i></i>


    <u></u>

    pre tag

    Details
    Category: Bacis Html
    Hits: 1153

    Preformatted Text

    Any spaces that you put into text that is surrounded by <pre>and</pre>
    is retained in the final output.
    Example of Preformatted Text:

    heading1
    heading2
    heading3
    column1 column2 column3 column4
    column1 column2 column3 column4



    Code Example below:
    <pre>

    heading1
    heading2
    heading3
    column1 column2 column3 column4
    column1 column2 column3 column4


    </pre>

    1. Horizontal Rules hr tag
    2. Line Break
    3. address tag
    4. Blockquote
    5. Special Characters
    6. Image Format
    7. Table tag
    8. Form

    Page 1 of 3