Thursday, October 31, 2013

How to use a combobox in html form

Posted By: Unknown on 10:11 PM
Hey guys..so far we have learned how to add textboxes checkboxes,radiobuttons and buttons in a html form..
Today we will learn about combobox,what combobox is and why do we use it for.
A combobox is a list which displays certain items,from that list you can select only one,a combo box opens a dropdown in which the list is displayed and from that you have to select one,for example a if you want to give an option for your users to select a country then you can use a combo box.

<html>
<body>

<select>
  <option value="pakistan">Pakistan</option>
  <option value="japan">Japan</option>
  <option value="india">India</option>
  <option value="china">China</option>
</select>
 
</body>
</html>

This is how combo box will look when you will click on the small arrow facing downwards.
Read More


Wednesday, October 30, 2013

How to add radio buttons in html form

Posted By: Unknown on 11:15 PM
Hey everyone,our topic for today is Radio Buttons.
We will learn how to add radiobuttons in a form,the process is the same as we used in adding checkboxes and textboxes so you will fine it very easy.
The purpose of using radio buttons is that if we want to give user an option to select one out of the all,for example in a registration form we give an option to the user about his/her gender.
Below is the code for using radio buttons.

<html>
<body>

<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>

</body>
</html>
Read More


Tuesday, October 22, 2013

How to use checkboxes in html

Posted By: Unknown on 9:51 PM
Hey everyone how are you guys,
so far we have learned about forms and how to create a form will textboxes and a button.
Today we will learn to add checkboxes in a form.
The reason for using a checkbox option in a form is if we want to select multiple items for example if we want to give a few options to the person and want him to select one or more than one items from the giving options in the checkboxes and the person selects from it.

<html>
<head>
<body>

<form>
<input type="checkbox" name="option1" value="Car"> Car<br>
<input type="checkbox" name="option2" value="Bike"> Bike<br>
<input type="checkbox" name="option3" value="Truck"> Truck<br>
</form>

</body>
</html>


So above is the code for adding checkboxes in a form,the procedure is the same as the procedure for adding the textbox fields.Anywhere in your website where you want to add checkboxes your will have to follow this procedure which is very simple and i assure your all that your will automatically memorize this after you use it once or twice.
I hope this helps,thank you for reading everyone..next we will learn to add radio buttons to our form.
Read More


Monday, October 21, 2013

How to create an html form

Posted By: Unknown on 8:10 AM
Hey every one how are you..
Today we will learn about forms.A form in html has the same meaning as any form which you fill out on paper.You can create your forms for your website such as a registration form etc.
To start with the basic you should know that the <form> tag is used to create an HTML form and when you are done creating a form your will have to close it as well using </form>

<html>
<body>

 <form>
First name: <input type="text" name="firstname"><br><br>
Second name: <input type="text" name="secondname"><br><br>

 <input type="submit" value="Submit">
</form>
</body>
</html>



So guys what i did above is i just gave 2 fields and a button to send the the data inserted into the fields to somewhere you want it to go.
First i wrote  the title for the fields so that the viewer of the form would know that this fields is for writing the first name or the second name.
Then i started by giving the type of input to be entered in the field which is "text",input data can be integer,float,char,string etc..
And then i gave a name to the field to be identified when you will have to insert it in the database table or to simply display it somewhere.
<br> tag stands for break line,it is used for giving a line space.
In the button I did the same,first i defined the type of input which is the submit,submit is used for submitting data to someplace.
Then i defined the value of the submit button. which will be displayed on the button as well.So this is how you create a form,further we will learn how to use check boxes,combo box,radio buttons and password in an HTML form.
Read More


Saturday, October 19, 2013

How to create ordered list,unordered list and description list

Posted By: Unknown on 5:26 AM
Hey everyone..
The topic for today is HTML List.A list in HTML has the same meaning as any list of items etc.
The 2 most common types of lists in HTML
1. Ordered
2. Unordered

To start an ordered list we use the tag <ol> and then <li> tag to write the name of each item of the list.
To start an unordered list we use the tag <ul> and then <li> tag to write the name of each item of the list.
To start description lists list we use the tag <dl> .Description list is a list of names, with a description of each name.
By using the following tags you can make a list of anything you want.The procedure is very simple you just have to open the <ol> or <ul> tags and inside them define the <li> tag which stands for link and give the name of the item you want to display in the list.
Code of ordered list

<html>
<body>

<h4>List of cars</h4>
<ol>
  <li>Toyota Corolla</li>
  <li>Ferrari</li>
  <li>Volvo</li>
</ol>

</body>
</html>



Code of unordered list

<html>
<body>

<h4>An Unordered List:</h4>
<ul>
  <li>Toyota Corolla</li>
  <li>Ferrari</li>
  <li>Volvo</li></ul>

</body>
</html>


Code of description list

<html>
<body>

<h4>List of cars</h4>
<dl>
<dt>Ferrari</dt>
<dd>-Color red</dd>
<dt>Toyota Corolla</dt>
<dd>- Color White</dd>
</dl>

</body>
</html>
Read More


How to create tables in an HTML document.

Posted By: Unknown on 3:14 AM
Hey everyone how are you
Today we will learn how to make tables in HTML.
A table is made so that you can display your data in a format in rows and columns.Tables are defined by the <table> tag and inside this tag you can start making rows of the table.
So lets get started,a table is divided into rows and each row is divided into data cells.
Table row can be defined by <tr></tr> and a table data cell is defined by <td></td>
<tr> stands for table row and <td> stands for table data.
You can put images,forms,lists etc in the table data.
<th> it defines the current cell as a table header.You can place the heading of the row in this <th> tag.

<html>
<body>

<table border="1">
<tr>
<th>First Name</th>
<th>Last Name</th>
</tr>
<tr>
<td>Konain</td>
<td>Shehzad</td>
</tr>
<tr>
<td>Arnold</td>
<td>Schwarzenegger</td>
</tr>
</table>

</body>
</html>

As you can notice here that we started with the <table> tag and inside it we write border="1" this defines the border of the table you are creating.
Then comes the <tr> tag which means that now we want to add a row and inside that row we gave the headings first name and last name,after giving the headings you will have to close the </tr> tag.What is opened must be closed.
Now you can notice that i have given the <tr>tag to give a row <tr> stands for table row and then <td> tag table data,and inside it i have written the data which i want to display,in this case i have displayed 2 name.
After putting data in the <td> tag i gave the </tr> tag to close it and then i closed the <table> tag by using </table>
This is how this code will give the output when you will try it.
Read More


how to align text by using CSS.

Posted By: Unknown on 1:24 AM
Hey everyone today we will learn how to align our text by using CSS.
Let me explain what align means in HTML.If you want your heading to appear in the center of the page then you can write align="center" and your text will appear in the center,in the same way you can align your text on left and right side of the page as well.
This is very simple,just copy and paste the code and you will see how you can align the text.

<html>
<body>

 <h1 style="text-align:center;">Blogs</h1>
<p>Hey everyone.</p>

 </body>
</html>

So this is how we align the text,"text-align:" this is the keyword and after the colon you can write where you want your text to appear.
This is how you can align your text on the right or left side.
<h1 style="text-align:left;">Blogs</h1>
<h1 style="text-align:right;">Blogs</h1>
Read More


Subscribe to: Posts (Atom)