Wednesday 18 July 2012

imp html tags examples


Span tag : (is used to color a part of the text ):
 -----------------------------------------------


<html>
    <head>
    </head>

<body>

<p>my villages name is <span style="color:red;"/>  gowrelly</span> </p>



 html layouts:
----------------


 <div id="container" style="width:500px">

<div id="header" style="background-color:#FFA500;">
          <h1 style="margin-bottom:0;">Main Title of Web Page</h1>
</div>

<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>Menu</b><br />
   HTML<br />
   CSS<br />
   JavaScript
</div>

<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
Content goes here</div>

<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
Copyright © W3Schools.com</div>


</div>

Html Forms  :
------------
<table>
<form >

<tr> <td><colspan="5" >First name :<input type="text" name="First name " /></td></tr> <br/>
<tr><td>  Sur name : <input type="text" name="surname" /></td></tr><br/>
  <tr><td> desired<br/> username:<input type="text" name="user name "/></td></tr>  <br/>
 <tr><td>  password <input type="password" name="password" </td></tr>/>  <br/>
 <tr><td>  Gender <input type="radio" value="male" /></td></tr> <br/>
<tr><td>   Female <input type="radio" value="female" /></td></tr>
<tr><td>   Highest qualification<br/>
ssc<input type="checkbox" value="ssc" /></td></tr><br/>
        <tr><td> intermediate    <input type="checkbox" value="inter" /></td></tr><br/>
                <tr><td>  graduation   <input type="checkbox" value="graduation" /></td></tr><br/> 
               <tr><td>   post graduation   <input type="checkbox" value="post graduation" /></td></tr><br/>                      
<tr><td> <input type="submit" value="submit"/></td></tr><br/>
</form>
</table>


Iframes in html:
------------------

<iframe src="http://www.w3schools.com/html/html_iframe.asp" frameborder="10"/>

<iframe src="http://news.google.co.in/nwshp?hl=en&tab=wn" frameborder="5"/>
<FRAMESET ROWS="75%, *" COLS="*, 40%">
     <FRAME SRC="first.html">
     <FRAME SRC="second.html">

</FRAMESET>
</body>
</html>

basic html tags


<html>
<head>
 style in css Internal:
----------------------
<style type="text/css">

body {background-color:cyan ;}

p {color:green;}

</style>

 style in the css with External :
---------------------------------
<link rel="stylesheet" type="text/css" href="mystyle.css" />


</head>

<body>

 heading tags
------------------
<h1>this is the H1 heading tag   </h1>
<h2>This is the H2 heading tag   </h2>
<h3>This is the H3 heading tag   </h3>
<h4>This is the H4 heading tag   </h4>
<h5>This is the H5 heading tag   </h5>
<h6>This is the H6 heading tag   </h6>

 paragraph tags  and multi lined comment in the html
----------------------------------------------------

<p> This is the paragraph tag  </p><hr/>

<p>
<! this is the comment tag of html>
this is the comment tag
</p>


 anchor ttag and break tags:
----------------------------

<br><a href="http://www.w3schools.com"> this is the the link to w3schools</a></br>
<a href="http://www.php.net" target="_blank">this is the link to php website</a><br>

<a href="http://images.google.com/search?num=10&hl=en&site=&tbm=isch&source=hp&biw=1366&bih=667&q=roses&oq=roses&gs_l=img.3..0l10.6567.8105.0.10205.5.5.0.0.0.0.111.502.3j2.5.0...0.0...1ac.xvy1Ydd4FdA" >this the link to see the rose flowers</a>


<a name="tips" > </a>
<a href="#tips">Visit the Useful Tips Section</a>

 Image tag and attributes:
--------------------------

<img src="C:/Users/Public/Pictures/Sample Pictures/penguins.jpg"  alt="unable to find the source" width="104" height="100"/>


inline css styles:
-------------------

<h4 style="background-color:red;">This is a heading</h4>
<p  style="background-color:green;">This is a paragraph.</p>
<p style="font-family:arial;color:red;font-size:20px;"> A Paragraph</p>
<p style="font-family:timesnewroman;font-size:30px;color:cyan;" >this is one more paragraph </p>

 table format :
 ---------------
<table border="3">
<tr><thead>
        <th> company name  </th>
        <th> Address       </th>
        <th> contact no   </th>
   <thead>
</tr>
<tr> 
      <td> 3kits        </td>
      <td> kpally       </td>
      <td>12345 </td>  
</tr>
<tr>

<td>mavin </td>
        <td>madhapur </td>
<td>456789 </td>

</tr>
</table>


 unordered list and Ordered list &Definition lists :
 -----------------------------------

<ul>
<li>Coffeee   </li>
<li>Milk      </li>
<li>Juice     </li>
</ul>

<ol>
<li>  school   </li>
<li>  College  </li>
<li>  University </li

</ol>
<dl>
<dt>Coffee </dt>
<dd>Black hot drink </dd>
<dt>Milk </dt>
<dd>White cold drink </dd>

</dl>
</body>

</html>