Friday 29 March 2019

Registration Form web page desing using html

  <--Create a web page Registration Form using Html--!>
 

<html>
<body bgcolor=pink text=blue>
<center>
<table border=5>
<h1><u>Registration Form</u></h1>

<form  action=reg>
<tr><th>first name:</th><td><input type=text name=fname><br><br></td></tr>

<tr><th>last name:</th><td><input type=text name=lname><br><br></td></tr>

<tr><th>Address:</th><td><textarea rows=3 columns=20> </textarea> <br><br></tr></td>

<tr><th>Gender:</th><td> <input type=radio name=gender value=male>male
        <input type=radio name=gender value=female>female<br><br></tr></td>

<tr><th>Languages known:</th><td><input type=checkbox name=language value=English>English
                <input type=checkbox name=language value=Hindi>Hindi
<input type=checkbox name=language value=Telugu>Telugu<br><br></td></tr>

<tr><th>country:</th><td>
         <select name=reg>
<option value="india">india
</select><br><br></td></tr>

<tr><th>Hobbies:</th><td>
<select name=reg size=3 multiple>
<option value="Reading Books">Reading Books
<option value="Playing Chess">Playing Chess
<option value="Playing Cricket">Playing Cricket
<option value="Watching Movies">Watching Movies
<option value="Watching Cricket">Watching Cricket
</select><br><br></td></tr>

<tr><th>username</th><td> <input type=text name=uname><br><br></td></tr>

<tr><th>password</th><td> <input type=password name=pword><br><br></td></tr>

<tr><th><input type=submit> </th>

<td><input type=reset></td></tr>
</table>
</form>
</center>
</body>
</html>















Wednesday 27 March 2019

introduction to HTML




Introducton to HTML :
 = = = =  =  = = = = = = 
 -> html stands for Hyper text markup language
-> html is standard markup language(presentation language) used to create web pages
-> html describe the structure of web pages
-> markup language contain set of markup tags organize the content
    Eg: <tag>content</tag>

 Note: 
= = = =
 Brower do not display the html tags but use them to present the content of the page

 Evolution of markup Languages:
= = = = = = = = = = = = = = = = =
1.GML:
-> Gml stands Generalized markup language
-> Gml is designed by IBM to prepare their internal document

2.SGML:
-> Sgml stands for Standard Generalized markup languages 
-> Gml rules are modified as tags in Sgml
-> first time markup tags are used in Sgml

3.Html & Xml:
-> Html is used for data presentation
-> xml stands for extensible markup language
-> xml is used for data representation (Storage)

drawing iphone icon using SVG

    
iphone icon


 <!--drawing iphone icon using SVG-->
<html>
<head> </head>
<body>
<h3>Drawing Graphic using SVG</h3>
<hr/>
<svg id="mysvg1" 
        width="400"
height="500"
style="border:2px solid blue;">

<!--outer rectangle-->

<rect x="80" y="50"
 rx="15" ry="15"
width="230" height="400"
style=fill:black;
stroke-width:2;stroke:black;"/>



<!--inner rectangle-->

<rect x="95" y="80"
  rx="15" ry="15"
 width="200" height="325"
  style=fill:white;
stroke-width:2;stroke:black;"/>

<!--Big circle-->

 <circle cx="190" cy="428" r="20"
      Stroke="black"
         stroke-width="2"
             fill="white"/>
  
<!--small circle-->

<circle cx="190" cy="65" r="10"
       Stroke="black"
        stroke-width="2"
         fill="white"/>
</svg>
</body>
</html>




Friday 22 March 2019

Happy Holi Animation Using Html and CSS






<!DOCTYPE html>
<html>
<head>
<style>
a
{
  margin:10px;
  text-decoration:none;
  color:white;
}
ul li
{
 padding-top:10px;
 text-align:center;
 list-style:none;
 float:left;
 height:30px;
 width:100px;
 border-right:3px solid white;
}

nav
{
background-color:Deeppink;
height:40px;
font-size:20px;
}

ul li:hover
{
 background-color:DodgerBlue;
 color:white;
}


footer
{
  background-color:Darkred;
  color:white;
  text-align:right;
  height:30px;
  padding-top:10px;
  border-radius:10px;
}
span 
{
 font-size:30px;
}
p
{
   text-align:justify;
   padding:5px;
}



</style>
</head>

<body bgcolor="lightyellow">

    <header>
<img src="logo.png" align="center" width="100"/> &nbsp
<span >sreenu  creations<span>
<hr/>
    </header>

<nav>
<ul>
    <li> <a href="#s3">Home</a></li>
<li> <a href="#s1">Courses</a></li>
<li> <a href="#s2">About us</a></li>
<li> <a href="#s4">Contact  </a></li>
<li> <a href="Login.html">Log in</a></li>
</ul>
</nav>
<br/> 
<marquee direction="right" scrollamount="5"><h1>Happy Holi</h1> </marquee>
<br/>
<marquee scrollamount="10"><img src="giphy.gif" width="200" border="1"/> </marquee>
<br/>
<marquee direction="right" scrollamount="5"><img src="giphy1.gif" width="200" border="1"/> </marquee>

<br/>  

<footer>
       &copy; copy right 2019 Bollaram, HYD.
</footer>
</body>
</html>    



Monday 18 March 2019

Web Technologies





client-server 



Web Technologies :
= = = = = = = = =

Html ,Css ,Java Script  are the 1 st party libraries built-in a brower like Google Chrome ,firefox,InternetExplore

Ajax is Technique it is used to communication with Client-Server Technologies

Jquery ,Angular js ,Bootstrap,React Js are the third-party libraries download it and attched to brower we use it.

Server side Technologies:
= = = = = = = = = = = = =
php, .Net,Ruby ,Python, Java ,Pearl Script,Express js  are the Server side Technologies  it is Runs in Server.

Databaes:
= = = = =
Mysql,Oracle,Sql Server,Mongo DB,DB2 are the Databases

Data Exchange:
 = = = = = = = =
Json ,xml are the Data Exchanges Client to Server and Server to Client  Communication with each others.
Json stands for Java Script Object Notation created by Google Company.

Servers:
= = = =
Tomcat Server, Web Logic Server, Node js  etc...




Friday 15 March 2019

College Login web page using Html and Css



 <! create a college login web page..!>

<!DOCTYPE html>
<html>
<head>
<style>
a
{
  margin:10px;
  text-decoration:none;
  color:white;
}
ul li
{
 padding-top:10px;
 text-align:center;
 list-style:none;
 float:left;
 height:30px;
 width:100px;
 border-right:3px solid white;
}

nav
{
background-color:Deeppink;
height:40px;
font-size:20px;
}

ul li:hover
{
 background-color:DodgerBlue;
 color:white;
}

article
{
  border:2px solid blue;
  margin:2px;
  border-radius:20px;
  padding:5px;
  background-color:lightpink;
}

footer
{
  background-color:Darkred;
  color:white;
  text-align:right;
  height:30px;
  padding-top:10px;
  border-radius:10px;
}
span 
{
 font-size:30px;
}
p
{
   text-align:justify;
   padding:5px;
}



</style>
</head>

<body bgcolor="lightyellow">

    <header>
<img src="logo.png" align="center" width="150"/> &nbsp
<span >Aurora's Technology & Research Institute<span>
<hr/>
    </header>

<nav>
<ul>
    <li> <a href="#s3">Home</a></li>
<li> <a href="#s1">Courses</a></li>
<li> <a href="#s2">About us</a></li>
<li> <a href="#s4">Contact  </a></li>
<li> <a href="Login.html">Log in</a></li>
</ul>
</nav>
<br/> <br/> 

<marquee color="red"><h2 >Admissions are open today</h2></marquee>
   <form name="f1" method="post" action="login" id="f1">
     <center>
    Student Id :<input type="text" name="Student" value=""/><br><br>
Password :<input type="password" name="password" value=""/><br><br>
          <input type="submit" name="Login" value="LogIn"/>
     </center>
</form>

<section>
      
   <h3 id="s4">Contact</h3>
   <article>
   <p> Aurora's Technological and Research Institute,<br>
       Parvathapur,Uppal,Hyderabad,Telangana-500093.<br>
   EMail: info@atri.edu.in <br>
          director@atri.edu.in<br>
       Contact: 040-20050999,9100000909
   </p>
   </article>
</section>
<br/>  

<footer>
       &copy; copy right 2019 Aurora's college, HYD.
</footer>
</body>
</html>    









   
   
   
   
   
   
   
   
   
   
   
   
   


  

Thursday 14 March 2019

College Web Pages Using Html and Css





<!DOCTYPE html>
<html>
<head>
<style>
a
{
  margin:10px;
  text-decoration:none;
  color:white;
}
ul li
{
 padding-top:10px;
 text-align:center;
 list-style:none;
 float:left;
 height:30px;
 width:100px;
 border-right:3px solid white;
}

nav
{
background-color:Deeppink;
height:40px;
font-size:20px;
}

ul li:hover
{
 background-color:DodgerBlue;
 color:white;
}

article
{
  border:2px solid blue;
  margin:2px;
  border-radius:20px;
  padding:5px;
  background-color:lightpink;
}

footer
{
  background-color:Darkred;
  color:white;
  text-align:right;
  height:30px;
  padding-top:10px;
  border-radius:10px;
}
span 
{
 font-size:30px;
}
p
{
   text-align:justify;
   padding:5px;
}



</style>
</head>

<body bgcolor="lightyellow">

    <header>
<img src="logo.png" align="center" width="150"/> &nbsp
<span >Aurora's Technology & Research Institute<span>
<hr/>
    </header>

<nav>
<ul>
    <li> <a href="#s3">Home</a></li>
<li> <a href="#s1">Courses</a></li>
<li> <a href="#s2">About us</a></li>
<li> <a href="#s4">Contact  </a></li>
<li> <a href="Login.html">Log in</a></li>
</ul>
</nav>
<br/> <br/> 

<marquee color="red"><h2 >Admissions are open today</h2></marquee>

<section>
       <h3 id="s3">Home</h3>
       <article>
   <p> 

            Aurora College delivers programs at three Campuses, 21 Community Learning Centres             and other community sites in the Northwest Territories.The Aurora Research Institute,               division of Aurora College, has three Research Centres since science must be accessible               to people and relevant to their everyday lives.Aurora Research Institute is dedicated to               the advancement of indigenous knowledge and the joining of indigenous knowledge with             western science.

          </p>
   
 <p>

           Aurora College delivers community-centred post-secondary programs that 
   accurately reflect northern culture and the needs of the northern labour market. 
   Aurora offers several certificate and diploma programs as well as  the Bachelor of                       Education Degree Program and the Bachelor of Science in Nursing   Program.
      </p>

   </article>
   <h3 id="s1">Courses</h3>
   <article>
   <h4>B.Tech</h4>
   <p>
            Information Technology.<br>
           Computer Science & Engineering.<br>
   Civil Engineering.<br>
   Mechanical Engineering.<br>
   Electronics Communication Engineering.<br>
   Electronics Electrical Engineering.
  </p>
    <h4>Deploma</h4>
<p>
   Computer Science & Engineering.<br>
   Electronics Communication Engineering.<br>
   Electronics Electrical Engineering.
</p>
   </article>
   <h3 id="s2">About us</h3>
   <article>
   <p>
              Aurora Research Institute of the former Science Institute of the Northwest Territories                  were amalgamated with the new colleges in January, 1995. The portion which now 
           functions as a division of  Aurora College is called the Aurora Research Institute, and                  offers licensing and research assistance in the western NWT. Aurora College has a                        mandate to deliver  community-centred post-secondary programs that accurately                        reflect Northern culture and the needs of the Northern labour market.

   </p>
      <p>
                  Today Aurora College is a modern and comprehensive post-secondary institution                          connected through transfer agreements and partnerships to a wide network of                              technical schools,colleges and universities throughout Canada and the circumpolar                      world. In addition to a broad range of trades and apprenticeship training and                               certificate, diploma and degree programs, the College offers adult literacy and basic                      education as well as a variety of continuing education courses. Building on over 40                       years of experience, Aurora College is well-positioned to work with Northerners to                        prepare them to build a strong and vibrant society in the NWT. .
   </p>
   </article>
   <h3 id="s4">Contact</h3>
   <article>
   <p>
                  Aurora's Technological and Research Institute,<br>
          Parvathapur,Uppal,Hyderabad,Telangana-500093.<br>
  EMail: info@atri.edu.in <br>
           @atri.edu.in<br>
         Contact: 040-20050999,9100000909
   </p>
   </article>
</section>
<br/>  

<footer>
       &copy; copy right 2019 Aurora's college, HYD.
</footer>
</body>
</html>    









   
   
   
   
   
   
   
   
   
   
   
   
   


  











Friday 8 March 2019

APPLYING CSS ON NUMBERS

<!--create a web page to apply the styles to list items so that display the item in circle format-->

<html>
<head>

<style>

#list1
{
 border:2px solid blue;
 width:120px;
 height:120px;
 padding:5px;
}

#list1 li
{

 border-radius:50px;
 text-align:center;
 background-color:blue;
 color:white;
 height:30px;
 width:30px;
 float:left;
 margin:5px;
 list-style:none;
 font-size:20px;

}
</style>
</head>
<h3>applying styles using CSS3</h3>
<hr/>

<ul id="list1">
           <li>1</li>
   <li>2</li>
   <li>3</li>
   <li>4</li>
   <li>5</li>
   <li>6</li>
   <li>7</li>
   <li>8</li>
   <li>9</li>
</ul>
</body>
</html>