Posts

Google clone using HTML and CSS

Image
Program : <html> <!--head section start--> <head> <title>Google</title> <style> span{border-bottom:2px solid royalblue; color:royalblue; border-padding:60px; padding-bottom:10px; } img{position:absolute; left:79px; top:85px; } input{position:absolute; top:189px; height:40px; width:80%; border-radius:80px; border-width:1px; border-style:solid; border-color:darkgray; } .button{background-image:url(/storage/emulated/0/aap/search.jpg); background-size:100% 100%; height:44px; width:70px; position:absolute; top:186px; left:275px; border-color:white; } .button1{background-image:url(/storage/emulated/0/aap/Weather.jpg); position:absolute; top:242px; height:100px; width:100px; background-size:100% 100%; border-color:transparent; } .button2{background-image:url(/storage/emulated/0/aap/Sports.jpg); position:absolute; top:237px; left:80px; height:100px; width:100px; background-size:100% 100%; border-color:transparent; } .button3{background-image:url(/storag

Twitter homepage

Image
I have created a Twitter homepage program using html and css. I have use some of the basic tags of html. You can see these tags in the following program. Program : <html> <head> <style> .img1{width:30; height:20; top:15px; } input{height:35; width:230; border-radius:35px; } .img2{position: absolute; top:3px; } p{word-spacing:23px; } span{color:deepskyblue; } .span{color:gray; font-size:13px; } .img3{position:absolute; right:3px; top:310px; } .img4{position:absolute; right:3px; top:665px; } .span1{color:black; } .button1{background-color:white; color:deepskyblue; width:48%; height:40px; border-radius:35px; border-color:deepskyblue; } .button2{background-color:deepskyblue; color:white; width:48%; height:40px; border-radius:35px; } </style>  <meta name="viewport" content="width=device-width"> </head> <body> <img class=

BOOK WEBPAGE

Image
HTML program for book webpage. Here I created program on favorite book. In this project I can use <style> tag and other tag in html. Program : <html> <head> <!--using css--> <style> body{background-image:url(https://images.pexels.com/photos/261821/pexels-photo-261821.jpeg?cs=srgb&dl=book-bookstore-close-up-college-261821.jpg&fm=jpg); background-size:cover; background-size:100% 100%; } h1{font-size:50px; } label{font-size:50px; } input{width:70%; height:4%; font-size:35px; background:transparent; text-align:center; color:white; placeholder:white; } button{height:4%; width:70%; background:transparent; font-size:35px; color:white; } </style> <!--ending css--> </head> <body> <h1><i>My Favorite Book :</i></h1> <!--paragraph--> <p><font size="10px">My favorite book is WINGS OF FIRE.The<br> author of

Tea😃😃

Image
HTML program for Tea. Program : <html> <head> <title>Tea</title> </head> <body bgcolor="lightgray"> <h1>Tea Recipe :</h1> <!--paragraph--> <p>I have created a Tea by using my recipe. I loves tea because it gives me a refreshment. A tea is most probably drink in india and especially in the Maharashtra.And the another is green  tea is always good for health.</p>  <h2> The Tea I have prepared is :</h2>  <!--image--> <img src="/storage/emulated/0/aap/Tea.jpg"height="180" width="350"> <!--order list--> <ol> <li>😃😃😃</li> <li>😊😊😊</li> <li>😗😗😗</li> <li>🤩🤩🤩</li> <li>😘😘😘</li> </ol> <p align="right">BY:~AA</p> </body> </html> Output :                                              

Tea program

Image
HTML program for Tea preparation. I have created a program using order list <ol>and unorder list<ul>.<li>tag is used for list and ending tag is </li>. I have also change body color using bgcolor attribute.I have also use heading tag.I have also use a <img> tag with src attribute. Program : <html> <head> <title>Tea Recipe</title> </head> <body bgcolor="lightyellow"> <h1>Tea Recipe:</h1> <h2>Ingredients For Tea:</h2> <!--unorder list--> <ul> <li>1 cup (250ml) Milk</li> <li>2 teaspoon Tea Powder</li> <li>1/4 (approx.60ml) Water</li> <li>3 teaspoon Sugar</li> </ul> <h2>Steps For Preparing Tea:</h2> <!--order list--> <ol> <li>Boil water in saucepan.</li> <li>Add sugar and tea powder in it and boil<br> it for 3-4 minutes on medium fl

CAR ANIMATION

Image
HTML PROGRAM FOR CAR ANIMATION USING MARQUEE TAG. <html> <head> <title>car</title> </head> <body> <marquee><img src="/storage/emulated/0/aap/c.png"height="100"width="100"><!--image address--></marquee> <hr> <marquee direction="right"><img src="/storage/emulated/0/aap/car.jpg"height="100"width="100"><!--image address--></marquee> <hr> <marquee><img src="/storage/emulated/0/aap/c.png"height="100"width="100"><!--image address--></marquee> <hr> <marquee direction="right"><img src="/storage/emulated/0/aap/car.jpg"height="100"width="100"><!--image address--></marquee> <hr> <marquee><img src="/storage/emulated/0/aap/c.png"height="100"width="100">

HTML Facebook login page

Image
Facebook Login Page Using HTML. <html> <head> <title>Facebook page</title> <style> .feildset{background-color:#0000FF; width:92%; text-align:center; color:white; } input{border-color: skyblue; width:100%; height:5%; } button {color:white; background-color: blue; width:100%; height:7%; } .button{background-color:green; width:60%; font-size:90%; } </style> </head> <body> <fieldset class=feildset>Facebook</fieldset> <br> Mobile number or email address <input type="text"><br><br> Password <input type="password"><br><br> <button>Log In</button> <p style=color:blue>Forgotten password?</p> <hr> <p>&nbsp&nbsp&nbsp&nbsp&nbsp--------------------------------or----------------------------------</p> <center><button class=button><b>Create New Account</b></

HTML SURVEY PAGE

Image
HTML PROGRAM FOR SURVEY PAGE. Here we can create 3 html files. 1. S1.html <html> <head> <title>project</title> <style> .button{color: black; padding:10px; font-size:17; background-color: white; } input[type=text]{ font-size:16px; width:70%; } </style> </head> <body bgcolor="orange"> <h2>BOLLYWOOD SURVEY PAGE</h2> <form action="/storage/emulated/0/HTML/S2.html"> ENTER YOUR NAME : <input type="text"placeholder="NAME"required> <br> ENTER YOUR CITY : <input type="text"placeholder="CITY"required> <br><br> <button class="button">ENTER SURVEY</button> </form> </body> </html> 2. S2.html <html> <head> <title>SURVEY</title> <style> .button{font-size:16px; background-color:red; color: black;

HTML Table

Image
HTML program for creating table. <html> <head> <title>Result Table</title> </head> <body bgcolor="pink"> <center><h2>Result Table</h2></center> <table border="1" width="100%"cellspacing="0"> <tr> <th>Name</th> <th>C</th> <th>C++</th> <th>Java</th> <th>Python</th> <th>Html</th> <th>Total</th> </tr> <tr> <td>Akash</td> <td>66</td> <td>57</td> <td>76</td> <td>88</td> <td>78</td> <td>365</td> </tr> <tr> <td>Bhavesh</td> <td>56</td> <td>67</td> <td>69</td> <td>88</td> <td>65</td> <td>345</td> </tr> <tr> <td>Nishant</td> <td>76</td> <

Result program script

HTML program for result page. Here we create two html files: 1.result.html <html> <head> <title>results</title> <style> .button{background-color:lightblue; font-size:15px; padding:10px; } </style> </head> <body> <form action="/storage/emulated/0/html/s.html"> <font color="darkblue"> <p align="right"> <img src="/storage/emulated/0/aap/u.jpg"height='90'width='90'></p> <h1>Sant Gadge Baba<br>Amravati University</h1> </font> <h2>Re-Accreated with "A" by NAAC</h2> <h4>(Formarly know as Amravati University)</h4> <img src="/storage/emulated/0/aap/g.png"height='100'width='100'> <table bgcolor="black"> <tr> <td><font color="white">Menu</td></font> <td>aksksgkwjshvsvfcddgevgdajvvgbshwehkf

Result output

Image
results Sant Gadge Baba Amravati University Re-Accreated with "A" by NAAC (Formarly know as Amravati University) Menu = Home / Examination / Exam Result Name Of Exam : BCA First Semester(Sem One) Winter BCA Second Semester(Sem Two) Winter BCA Third Semester(Sem Three) Winter BCA Forth Semester(Sem Forth) Winter BCA Fifth Semester(Sem Fifth) Winter BCA Sixth Semester(Sem Sixth) Winter Please Enter Roll Number :

Result

next You Have Been Passed. Your Score is 80%. CONGRATULATIONS. By:~AA

Registration form script

Program for registration form in html. <html> <head> <title> registration form </title> </head> <body bgcolor = "lightblue" > <form > <table> <h1> AK SOFTWARE </h1> <tr> <td> NAME : </td> <td><input type = "text" placeholder = "NAME" ></td> </tr> <tr> <td> COLLEGE NAME : </td> <td><input type = "text" placeholder = "COLLEGE NAME" ></td> </tr> <tr> <td> ADDRESS : </td> <td><input type="text"placeholder="ADDRESS"></td> </tr> <tr> <td>CITY :</td> <td> <select> <option>SELECT</option> <option>GHATANJI</option> <option>YAVATMAL</option> <option>AURANGABAD</option> <option>AMRAVATI</option> <option>NAGPUR<

Registration form output

registration form AK SOFTWARE NAME : COLLEGE NAME : ADDRESS : CITY : SELECT GHATANJI YAVATMAL AURANGABAD AMRAVATI NAGPUR MUMBAI DISTRICT : SELECT YAVATMAL AMRAVATI NAGPUR MUMBAI PUNE AURANGABAD STATE: SELECT MAHARASHTRA AP ODIDA KERALA GOA UTTARAKHAND GENDER : MALE FEMALE MOBILE NUMBER : EMAIL PASSWORD ACCEPT THE TERMS AND CONDITION

HTML REGISTER FORM

Image
Program for Register from in HTML. Here we create two html program: 1.register.html <html> <head> <title> login form </title> <style> . button { background-color : green ; color : white ; font-size : 16px ; width : 150% ; } </style> </head> <body bgcolor = 'lightblue' > <form action = "/storage/emulated/0/html/n.html" > <table> <center><h1> AK SOFTWARE </h1></center> <h1> --------Register--------- </h1> create your account.its free and only takes a minute. <tr> <td> <input type = "text" placeholder = "First Name" > </td> <td> <input type="text"placeholder="Last Name"size='16'> </td> </tr> <tr> <td> <input type="email"placeholder="Email"> </td> </tr> <tr> <td> <input type=&

Html calculator script

Image
Here we can create calculator using html. The code for calculator is given below: <!DOCTYPE html> <html>     <head>         <title>calculator</title>         <style>             body{                 background:skyblue;             }             *{                 box-sizing:border-box;                 -webkit-box-sizing:border-box;                 -moz-box-sizing:border-box;             }             .wrap{                 width:350px;                 margin:auto;                 height:auto;                 background:black;                 padding:15x;             }             input[type=text]{                 width:90%;                 padding:10px;                 font-size:22px;                 font-weight:bold;                 margin-top:20px;                 border-radius:5px;             }             input[type=button]{                 width:75px;                 padding:10px;                 font-size:2