Que 1. Create a simple HTML webpage showing paragraph and image insertation. Coding <!DOCTYPE html> <html> <head> <title>Paragraph and image insertation</title> </head> <body> <p>Que. Who Invented the Computer and when?</p> <img src="C:\Users\pc\Desktop\CharlesBabbage.jpg"alt="image" height="220" width="420"> <p>Ans : Computer is conceived and designed by British mathematician Charles Babbage between 1833 and 1871.</p> </body> </html> Output of above coding shown below Que 2. Create a webpage that uses subscript and superscript having background colour red. Coding <!DOCTYPE html> <html> <head> <title>Subscript and Superscript</title> </head> <body bgcolor="RED"> <h1>1. Some Algebric formula</h1> <ol> <li> a + b<sup>2</sup> = a<sup>2</sup> + 2ab + b<sup>2</sup></li> <li> a - b<sup>2</sup> = a<sup>2</sup> - 2ab + b<sup>2</sup></li> <li> a<sup>2</sup> - b<sup>2</sup> = (a + b)(a - b)</li> <li> a<sup>3</sup> + b<sup>3</sup> = (a + b)(a<sup>2</sup> - ab + b<sup>2</sup>)</li> <li> a + b<sup>3</sup> = a<sup>3</sup> + b<sup>3</sup> + 3ab(a + b)</li> </ol> <h1>2. Balance the following chemical equations.</h1> <ol> <li>Fe+H<SUB>2</SUB>O→Fe<SUB>3</SUB>O<SUB>4</SUB>+H<SUB>2</SUB></li> <li>HNO<SUB>3</SUB>+Ca(OH)<SUB>2</SUB>→Ca(NO<SUB>3</SUB>)<SUB>2</SUB>+H<S UB>2</SUB>O</li> <li>NaOH+H<SUB>2</SUB>SO<SUB>4</SUB>→Na<SUB>2</SUB>SO<SUB>4</SUB>+H<SUB> 2</SUB>O</li> <li>NaCl+AgNO<SUB>3</SUB>→AgCl+NaNO<SUB>3</SUB></li> <li>BaCl<SUB>2</SUB>+H<SUB>2</SUB>SO<SUB>4</SUB>→BaSO<SUB>4</SUB>+HCl</li> </ol> </body> </html> Output of above coding shown below 3. Create a webpage that displays the marks of 10 students of your class. Having border to colour of table green also include heading. Coding <html> <head> <title>regster form</title> </head> <body> <table align="center" border="1" bordercolor cellspacing="0"> <h1><center><B><U>Periodic Test Marks list</center></h1> <tr> <th colspan="6" align="center">Class-10<sup>th</sup></th> </tr> <tr> <th rowspan="2">S.no.</th> <th rowspan="2">Student Name</th> <th colspan="4">Subject</th> </tr> <tr> <td>MATH'S</td> <td>SCIENCE</td> <td>S.ST.</td> <td>COMPUTER</td> </tr> <tr align="center"> <td>1.</td> <td>Abhinav Singh</td> <td>33</td> <td>32</td> <td>36</td> <td>35</td> </tr> <tr align="center"> <td>2.</td> <td>Aryan Chauhan</td> <td>35</td> <td>34</td> <td>38</td> <td>37</td> </tr> <tr align="center"> <td>3.</td> <td>Harsh Singh </td> <td>37</td> <td>32</td> <td>38</td> <td>36</td> </tr> <tr align="center"> <td>4.</td> <td>Pranav</td> <td>37</td> <td>36</td> <td>31</td> <td>33</td> </tr> <tr align="center"> <td>5.</td> <td>Rishab sodhia</td> <td>37</td> <td>39</td> <td>32</td> <td>38</td> </tr> <tr align="center"> <td>6.</td> <td>Saransh</td> <td>37</td> <td>36</td> <td>34</td> <td>38</td> </tr> <tr align="center"> <td>7.</td> <td>Anubhav</td> <td>39</td> <td>37</td> <td>34</td> <td>33</td> </tr> <tr align="center"> <td>8.</td> <td>Ashish Sahu</td> <td>37</td> <td>36</td> <td>34</td> <td>32</td> </tr> <tr align="center"> <td>9.</td> <td>Ankush</td> <td>33</td> <td>34</td> <td>36</td> <td>37</td> </tr> <tr align="center"> <td>10.</td> <td>Vipul Dwivedi</td> <td>37</td> <td>33</td> <td>35</td> <td>34</td> </tr> </table> </body> </html> Output of above coding shown below ate HTML webpage of nest list as follows using both Ordered and unordered list tags. Coding <html> <head> <Title>Various Bullet styles </Title> </head> <body> <h1><center> Various Bullet Styles </center></h1> <h2>1. Operating system</h2> <UL type = circle > <LI>Disk operating system</LI> <LI>Windows</LI> <LI>Unix</LI> <LI>Linux</LI> </UL> <h2>2. MS Office</h2> <UL type = square> <LI>Word</LI> <LI>Access</LI> <LI>Power Point</LI> <LI>Excel</LI> </UL> <h2>3. Openoffice.org</h2> <UL type = disc > <LI>Writer</LI> <LI>Calc</LI> <LI>Impress</LI> <LI>Base</LI> </UL> <h2>4. Accessories</h2> <OL type = "i" > <LI>Paint</LI> <LI>Calculator</LI> <LI>Note Pad</LI> <LI>Word Pad</LI> </OL> </body> </html> Output of above coding shown below ahte two HTML code separately and create hyperlink next and back in the first page and second page respectively. Coding Output of above coding shown below Output of code 1 Output of code 2 ate simple HTML form in which heading should be student registration form and bold blue and underline. <html> <head> <title>regster form</title> </head> <body> <form> <table> <h1><center><B><I><U>STUDENT REGISTRATION FORM</center></h1> <tr> <td>Name :</td> <td><input type = "text" placeholder="Name"></td> <td>Roll No :</td> <td><input type = "text" placeholder="Roll No"></td> </tr> <tr> <td>Father's Name : </td> <td><input type="text" placeholder="Father's Name"></td> <td>Class : </td> <td><input type ="text" placeholder ="Class"></td> </tr> <tr> <td>Mother's Name : </td> <td><input type="text" placeholder="Mother's Name"></td> </tr> <tr> <td>Gender : </td> <td><input type = "radio" name= "Gender" >male<input type = "radio" name = "Gender">Female</td> </tr> <tr> <td>DOB : </td> <td><input type ="date" placeholder ="DOB"> </td> </tr> <tr> <td> phone no. : </td> <td> <select> <option>+91</option> <option>+92</option> </select> <input type ="phone"> </td> </tr> <tr> <td><input type="Submit"></td> </tr> </table> </form> </body> </html>
