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
4 comments

BOOK WEBPAGE

-

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 this book is Dr.A.P.J.ABDUL KALAM SIR.</font></p>
<h1><i>Today's Thought :</i></h1>
<!--paragraph-->
<p><font size="10px">"A Room Without Books Is Like A Body Without A Soul."</font></p>
<!--label tag-->
<label>So What Is Your Favorite Book ?</label><br><br>
<!--input tag-->
<input type="text"placeholder="Favorite Book"><br><br>
<!--button tag-->
<button>submit</button>
<!--paragraph-->
<p align="right"><font size="10px"color="white">By:~AA</font></p>
<hr>
<br>
<!--paragraph-->
<p><font size="8px"color="white">Created by :Akash Agarwal<br>
Mail me &nbsp&nbsp&nbsp&nbsp : <a href="mailto:125akash.aa@gmail.com" >125akash.aa@gmail.com</a><br>
visit blog &nbsp&nbsp&nbsp:<a href="https://125program.blogspot.com">125program.blogspot.com</a>
</font></p>
</body>
</html>

Output :

                                                                   By:~AA

Comments

Post a Comment

Popular posts from this blog

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
Read more

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> <
Read more