Posts

Showing posts from October, 2018

News Website Layout

-
Image
I had a web Engineering lab, in which I need to make a website layout as that of BBC News . So, I made a Banana News Network website layout. Before going towards the code, I want to tell you that I mostly did the work using division tag <div></div>.  The same work can be done using tables, but div provides you more flexibility and responsiveness. So, I used both the div tags and tables. Now, below is the code of that website layout. I am sharing it because the lab has been marked. CODE: <!DOCTYPE html> <html> <head><title> bbc </title> <link rel= "stylesheet" href= "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" > <style> @media screen and ( min-width : 480px ) { li { display : block ; text-decoration : none ; text-align : left ; color : red ; padding : inherit ; font-size : 17px ; margin : auto ; bor...
Post a Comment
Read more

Let's write a Story..

-
Image
HTML provides us the opportunity to write stories by using beautiful background and themes. Let us write a story using HTML (do not ignore CSS) (NOTE: I took the story from here ) HTML Code with Internal CSS: (The code within <style></style> tag is CSS code. This is used for styling.) <!DOCTYPE html> <html> <head><title></title></head> <style> body { background-image : url(https://ubisafe.org/images/leaf-transparent-gif-3.gif) ; } header { background-image : url(https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTtDfPZ1vWpRDFkDl8dZ7h1IYsNolC3Mqos_7DitiaztuzI-8yi0w) ; width : 100 %; /*background-repeat: no-repeat;*/ text-align : center ; height : 100px ; padding-top : 0.1px ; padding-bottom : 17px ; } #header { } #container { background : white ; width : 50 %; padding : 20px ; text-align : justify ; margin-left : 25 %; border : 10px solid orange ; box-shadow: -...
Post a Comment
Read more

Guess Number GAME : HTML

-
Image
Python is pretty good language but HTML is pretty web language... so, in first semester I wrote a python code for guess number game, but, now we will learn how to make a guess number game using HTML... so below is the code for it, I will try to upload all my codes on github... and will share a link with you. But for now consider the below mentioned code, in HTML and styling using internal CSS. Code: <!DOCTYPE html> <html> <head><title></title></head> <script src= "https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script> <style> body { background : url("https://cdn.pixabay.com/photo/2015/01/08/15/54/lines-593191_960_720.jpg") ; } h1 { margin-top : 10px ; font-family : cursive ; color : black ; background : white ; } table { padding-top : 20px ; border : 10px solid purple ; padding-left : 60px ; padding-bottom : 20px ; } td { width : 20 %; heig...
Post a Comment
Read more

webpage image

-
Image
1 comment
Read more

Form : Coming Fast..

-
Image
Form is one of the significant method for data collection. If you want to make forms for any society or for some other work, then you are at right place.  In this blog post we will learn to make a simple but useful form.  First of all: Open any text editor like notepad, then save the file as "form.html"..... Now start coding.. Write the below mentioned code into the form.html file using a test editor. Code: (HTML) <!DOCTYPE html> <html> <head> <title> Form </title> <link rel= "stylesheet" href= "style.css" type= "text/css" > </head> <body> <div id= "container" > <h1> Fill In The Form.. </h1> <div id= "formBody" > <form> Name: &nbsp; <input type= "text" placeholder= "enter your name.." ><br><br> Class: &nbsp;&nbsp; <input type= "text" p...
Post a Comment
Read more