Saturday, December 29, 2018

INTRODUCTION TO HTML AND XHTML

Basic HTML Structure

MylistMe - Hypertext Markup Language (HTML) is the language used to write web pages. The main feature of HTML documents is the presence of tags and elements. Elements in HTML documents are categorized into two, namely the <HEAD> element which functions to provide information about the document and the <BODY> element that determines how the contents of a document are displayed by the browser, such as paragraphs, lists, tables and others. While the tag is stated with a smaller sign "<" (initial tag) and a bigger sign ">" (end tag). In its use most of the HTML code must be located between container tags. It starts with <namatag> and ends with </ namatag> (there is a "/").

HTML documents have three main tags that form the structure of HTML documents, namely HTML, HEAD and BODY.

HTML tags function to declare an HTML document, HEAD tags function to provide information about HTML documents and BODY tags function to store information or data that will be displayed in HTML documents.


LISTS

There are five types of lists that can be used, namely:

Unordered Lists <UL>:

To list items with bullet marks. List entries are defined by the <li> tag. Example:

<ul>
<li> item number 1
<li> item number 2
<li> item number 3
</ul>

The results of the above code are:
  • item number 1
  • item number 2
  • item number 3 

Ordered Lists <OL>:

Also used to create a list of items, with each item can use Arabic or Roman numerals. List entries are also defined with <LI> tags.

 Example: 
<ol type = 1>
<li> item number 1
<li> item number 2
<li> item number 3
</ol>

The results of the above code are:
  1. Item number 1
  2. Item number 2
  3. Item number 3
Lists Definition: <DL>
Example:
<dl> 
<dt> first item. 
<dd> explanation of the first item. 
<dt> second item. 
<dd> explanation of the second item 
</dl>
The results of the above code are: 

first item.
explanation of the first item.
second item.
explanation of the second item

IMAGE

Used to display gif images or animations on your web page. Attributes: alt, align = (center, left, right), hspave, vspace, border, width & height.
Example: 
<img src = "logo.gif" alt = "this is the opening page logo" width = 200 height = 100> <img src = "logo.gif" hspace = 10 vspace = 5 align = right border = 2>

TABLE 

In making homepages, tables have functions that are no less important than other HTML tags. First the table functions to display information in a structured, concise and easy to read manner, both functions to set the appearance of the homepage to make it more attractive. 
The main tag for the table is <TABLE> </ TABLE> and to make the table title tag the table header <TH> </ TH> then to create table data or table contents using table data tags <TD> </ TD> and for creating rows is to use the Table Rows <TR> </ TR> tag.

FORM

Form is usually used to collect information from the user, allowing a web server to receive information from the user through a number of elements called controls. This control can be a textbox, checkbox, radio button, push button, menu list and more.
Writing standard form: 
<form method = "post / get" action = url ">
…… ..
…….
</form>

The method attribute has two post and get values. The get method sends data to the server by placing data at the end of the designated URL. The post method sends the data separately. If the input data is a lot, it is better to use the post method. The action attribute contains the URL of the program called by the form.

TEXTBOX

Textbox is one type of control for entering data. HTML provides the <input> tag with the type = "text" attribute for creating input boxes. Another attribute is name to name the input, Value attribute to give an input value and size attribute to determine the longest limit for an input.
In our textbox you can also hide input written by the user by giving a type = "password" value. The input will be the character "*"..

CHECKBOX

Checkbox is used to give several choices to the user. With the checkbox the user can choose one, more than one choice or not at all choose.

RADIO

in Radio type, the user chooses one of the available options, so the user cannot choose less or more choices. The Checked attribute indicates that the option is being activated.

SUBMIT and RESET

Each form must have a minimum submit and reset button. To make it use the type = "submit" and type = "reset" attributes. The submit button is used when a user fills out a form and wants to send it to the server. While reset is used when the user wants to delete all entries written.

No comments:

Post a Comment