Html Practical Assignments

-

 HTML PRACTICAL ASSIGNMENT:


PROGRAM:

<!--

          Assignment 1 Set A Q.1 

Q.1 Create an html page with 7 separate lines in different sizes. state size of each line in its text. 

-->


<!DOCTYPE html>

<html>

 <head> 

    <title> mysize </title>

 </head>


 <body>


    <h3> <big> <b> This is heading tags for different sizes </b> </big> </h3>


  <h1> My Size is 1 </h1>

  <h2> My Size is 2 </h2>

  <h3> My Size is 3 </h3>

  <h4> My Size is 4 </h4>

  <h5> My Size is 5 </h5>

  <h6> My Size is 6 </h6>

  <h>  My Size is normal </h>

 

 </body>

 </html>


WebPage Output:


This is heading tags for different sizes

My Size is 1

My Size is 2

My Size is 3

My Size is 4

My Size is 5
My Size is 6

My Size is normal


PROGRAM:

<!--

  Assignment 1 Set A Q.2 

     Q.2 Create an html page with 7 separate lines in different colours. state color of each line in its text. 

 -->


<!DOCTYPE html>

<html>

 <head> 

    <title> Mycolour </title>


 </head>


 <body>

    <p> <big> <b> This is Font tags for colour </big> <b> </p>


    <font color = "pink" >    My Colour is Pink     </font> <br>

    <font color = "yellow" >  My Colour is yellow   </font> <br>

    <font color = "skyblue" > My Colour is skyblue  </font> <br>

    <font color = "red" >     My Colour is red      </font> <br>

    <font color = "green" >   My Colour is green    </font> <br>

    <font color = "purple" >  My Colour is purple   </font> <br>

    <font color = "indigo" >  My Colour is indigo   </font> <br>


 </body>

 </html>


WebPage Output:


This is Font tags for colour

My Colour is Pink
My Colour is yellow
My Colour is skyblue
My Colour is red
My Colour is green
My Colour is purple
My Colour is indigo


PROGRAM:

<!--

    Assignment 1 Set A Q.3 

     Create an html page with all different text styles (bold, italic and underline) 

         and its combination on separate lines. state style of each line in its text      

-->


<!DOCTYPE html>

<html>

 <head> 

    <title> MyStyles </title>

 </head>


 <body>

    <p> <big> <b> This is Styles tags for Bold, Italic, Underline </big> <b> </p>


   <b> This Text is Bold </b> <br>


   <i> This Text is Italic </i> <br>


   <u> This Text have Underline </u> <br>

  

 </body>

 </html>


WebPage Output:

This is Styles tags for Bold, Italic, Underline

This Text is Bold
This Text is Italic
This Text have Underline


PROGRAM:

<!--

       Assignment 1 Set A Q.4 

     Q.4 Create an html page containing the polynomial expression as follow: a 0 + a 1 x + a 2 x^2 + a 3 x^3    

-->


<!DOCTYPE html>

<html>

 <head> 

    <title> MyPolynomial </title>

 </head>


 <body>

    <p> <big> <b> This is subscript and superscript tag </big> <b> </p>


    a <sub> 0 </sub> + a <sub> 1 </sub> x + a <sub> 2 </sub> x <sup> 2 </sup> + a <sub> 3 </sub> x <sup> 3 </sup>

 </body>

 </html> 


WebPage Output:


This is subscript and superscript tag

a 0 + a 1 x + a 2 x 2 + a 3 x 3


PROGRAM:

<!--

<h1>  Assignment 1 Set A Q.5 </h1>

    <h2> Q.5 Create an html page with red background with the message "warning" in large size blinking. 

         add scrolling text "read the message " below it.     </h2>

-->


<!DOCTYPE html>

<html>

 <head> 

    <title> MyBackground </title>  

 </head>


 <body background="red">

   

  <h1> <blink> Warning </blink> </h1>

  <marquee>  Read the Message </marquee>


 </body>

 </html>


WebPage Output:


Warning

Read the Message



PROGRAM:

<!--

  Assignment 1 Set B Q.1 

     Q.1] Create an html page with following specifications. 

      a) Title should be about myself 

      b) color the background with the pink color

      c) place your name at the top of the page in large text and centered.

      d) Add names of the family members each in different colour, types, typeface

      e) Add Scrolling text with message of your choice.

      f) Add your Image at the bottom


  -->


<!DOCTYPE html>

<html>

 <head> 

    <title> MySelf </title>    

 </head>


 <body background="pink" >

   

  <h1 align="center"> Ryan Gosling   </h1>  <br>

  <font color = "pink"> James Gosling </font> <br>

  <font face = "arial"> Emma Gosling </font>  <br>

  <font size = "7"> Hermione Gosling </font>


  <marquee> <big> Learnwithnil </big> </marquee>


  <img align="bottom" src="https://wallpapercave.com/wp/TY5Axoh.jpg" height="200" width="200">


 </body>

 </html>


WebPage Output:

Ryan Gosling


James Gosling
Emma Gosling
Hermione Gosling Learnwithnil 



PROGRAM:

<!--

  Assignment 1 Set B Q.2 

     Q.2] Create an html page with following specifications. 

      a) Title should be about mycollege 

      b) put the window logo image in the background

      c) place your college name at the top of the page in the large text followed by address in the smaller size

      d) Add names of the cources offered each in differed colour, style and typeface

      e) Add Scrolling text with message of your choice.

      f) Add  the college Image at the bottom


  -->


<!DOCTYPE html>

 <html>

  <head><title> mycollege</title>

  <marquee> Learnworld </marquee>

  <style>

    body

      {

        background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibQE1i3x7xamL8P9UnggYJzXl7o_MXblKPTM1xib2z3vObKSG9RtpM7a5QlydlGoE3G3BeOoQajU5gR6ANBarWdguinUw7jtlA5KJ_tGd5tmSkpDbo99GduFsNmP_vTiZp0cDb0FJ_udo/s1600/1.jpg");

      background-color: "skyblue"

          }

 </style>

 </head>


    <body>

    <h1> Vidya Pratishthan... </h1>

    <small> baramati.. </small> <br>

    <b> Cources: </b> <br>

     

    <font color = "blue" size = "3" > HTML  </font> <br>

    <font color = "red" size = "5" > CSS </font> <br>

    <font color = "green" size = "7" > JAVASCRIPT </font> <br>

        <font color = "indigo" size = "8" > JAVA  </font>  <br>


      <img align="bottom" src="https://scontent.fpnq13-1.fna.fbcdn.net/v/t39.30808-6/308688791_604551241364854_7303144330378847798_n.jpg?_nc_cat=111&ccb=1-7&_nc_sid=e3f864&_nc_ohc=lQ-eSJBzpnoAX-ABAzn&_nc_ht=scontent.fpnq13-1.fna&oh=00_AT8dUa37tz90cU9zJDCQjkSJWyoeNDnaoEpG7r0NB73vVA&oe=6335E553" height="200" width="500">

    </body>


</html>


WebPage Output:





PROGRAM:

<!--

  Assignment 1 Set B Q.3 

     Q.3] Create an html page with following specifications. 

      a) Title should be about mycity

      b) place your city name at the top of the page in the large text, in blue colour

      c) Add names of the landmarks in your city each in different color, styles, and typeface

      d) One of the landmark, your college name should be blinking

      e) Add Scrolling text with message of your choice.

      f) Add some Image at the bottom


  -->


<!DOCTYPE html>

 <html>

  <head><title> mycity</title>

  <marquee> Learnworld </marquee>  

 </head>


    <body>

    <h1> <font color = "pink"> Baramati </font> </h1>

    

     

    <font color = "blue" size = "3" > Pencil Chawk  </font> <br>

    <font color = "red" size = "5" > Nakshatra Garden </font> <br>

    <font color = "green" size = "7" > Eiffel Tower </font> <br>

       <blink>  <font color = "indigo" size = "8" > MIDC  </font> </blink> <br>


    <img align="bottom" src="https://wallpapercave.com/wp/TY5Axoh.jpg" height="200" width="200">


    </body>


</html>


WebPage Output:


Learnworld

Baramati

Pencil Chawk
Nakshatra Garden
Eiffel Tower
MIDC



PROGRAM:

<!DOCTYPE html>

<html>

 <head>

   <title> MyList </title>

  </head>


  <body style = "background-color:tomato" >

  <h1 style = "font-size:300%; text-align:center"> Learnworld </h1>

  <h1 style = " color:indigo" > List of Indian States with their capital </h1>


  <ol >

  <li> Dehli </li>

  <ul> 

           <li> NewDehli </li>

  </ul>

  </ol>


  <ol>

  <li> Harayana </li>

  <ul> 

           <li> Chandigarh </li>

  </ul>

  </ol>


  <ol>

  <li> Gujarat </li>

  <ul> 

           <li> Gandhinagar </li>

  </ul>

  </ol>


  <ol>

  <li> Rajsthan </li>

  <ul> 

           <li> Jaipur </li>

  </ul>

  </ol>


  <ol>

  <li> Maharashtra </li>

  <ul> 

           <li> Mumbai </li>

  </ul>

  </ol>


  <ol>

  <li> Uttarpradesh </li>

  <ul> 

           <li> Lucknow </li>

  </ul>

  </ol>

  </body>

</html>


WebPage Output:


Learnworld

List of Indian States with their capital

  1. Dehli
    • NewDehli
  1. Harayana
    • Chandigarh
  1. Gujarat
    • Gandhinagar
  1. Rajsthan
    • Jaipur
  1. Maharashtra
    • Mumbai

  1. Uttarpradesh
    • Lucknow



PROGRAM:

<!DOCTYPE html>

 <html>

  <head> <title> MyBooksTable</title>


  <style type="text/css">

    table

      {

        text-align:center;

        

      }


  </style>


  </head>


  <body bgcolor="pink">

  <table border="2">

  <tr>

  <th colspan="4"> List of Books </th> 

  </tr>


      <tr>

        <th rowspan = "2"> Item No</th>

        <th rowspan = "2"> Item Name </th>

        <th colspan = "2"> Price </th> 

          <tr>

            <td> Rs.</td>

            <td> Paise </td>

          </tr>

      </tr>


  <tr> 

        <td> 1 </td>

        <td> Programming in Python </td>

        <td> 500 </td>

        <td> 50  </td>

      </tr>


      <tr> 

        <td> 2 </td>

        <td> Programming in Java </td>

        <td> 345 </td>

        <td> 30  </td>

      </tr>

      


  </table>

  </body>

 </html>



WebPage Output:

List of Books
Item NoItem NamePrice
Rs.Paise
1Programming in Python50050
2Programming in Java34530




PROGRAM:

<!DOCTYPE html>

<html>

<head>

<link rel = "stylesheet" href = "Styles.css">

</head>

<body>


<h1>This is a heading</h1>

<p>This is a paragraph.</p>


</body>

</html>


Webpage Output:


This is a heading

This is a paragraph.


PROGRAM:

Styles.css

body {

  background-color: powderblue;

    background-image:url("https://wallpapercave.com/wp/TY5Axoh.jpg");

}

h1 {

  color: blue;

  font-size:300%;

}

p {

  color: red;


}



FORM

PROGRAM:

<!DOCTYPE html>

<html>

<head>

<title> Myform</title>

</head>

<body bgcolor="yellow">

 <form>


  <h1> Operating Sytem information </h1>

  <label for="name"> Enter ur name : </label>

  <input type ="text" name = "name" id = "name" > <br>


  <label for = "Pass"> Password : </label>

  <input type = "password" name=Pass id = Pass > <br>


  Which of the following  operating system you used:<br>

  

  <input type="checkbox" name="check1" id = "check1"> 

  <label for = "check1"> Window </label> <br>

  <input type="checkbox" name="check2" id = "check2"> 

  <label for = "check2"> Linux </label> <br>

  <input type="checkbox" name="check3" id = "check3"> 

  <label for = "check3"> Ubantu </label> <br>

 

 Which of the following  operating system you like:<br>

  

  <input type="radio" id="one" name="one" >

  <label for="one"> Window </label><br>

  <input type="radio" id="two" name="two" >

  <label for="two"> Linux </label><br>  

  <input type="radio" id="three" name="three" >

  <label for="three"> Ubantu </label><br><br>


  You have to complete the form 

  <button type="button" > sign up  </button>


 </form>

</body>

</html>



WebPage Output:


Operating Sytem information



Which of the following operating system you used:
 
 
 
Which of the following operating system you like:
 
 
 

You have to complete the form 


PROGRAM:

<!DOCTYPE html>

<html>

<head> 

<title> mylist </title>

<link rel="stylesheet" href="ListExternalcss.css">

</head>

<body>

 

<h1> <big> List </big> </h1>

 <ul>

  <li> Non Flowering Plants </li>

    <ul>

    <li> Fern </li

    >

    <li> Spore </li>

    </ul>

 </ul>


 <ul>

  <li> Flowering Plants </li>

    <ul>

    <li> Lily </li>

    <li> Rose </li>

       <ol>

          <li> Red Rose </li>

          <li> Pink Rose </li>

       </ol>

    </ul>

 </ul>


</body>

</html>


WebPage Output:


List

  • Non Flowering Plants
    • Fern
    • Spore

  • Flowering Plants
    • Lily
    • Rose
      1. Red Rose
      2. Pink Rose




PROGRAM: ListExternalcss.css


ul{

background-color:pink;

font-size:150%;

color:"red";

}


ol{

background-color: skyblue;

font-size: 80%;

color: green;

}


PROGRAM:

<!DOCTYPE html>

<html>

<head> 

<title> myNevigationBar </title>

<style type="text/css">

</style>

</head>


<body bgcolor="pink">

<h1> Nevigation Bar </h1>

  <a href="https://learnwithnil.blogspot.com"> Home </a> ||

  <a href="https://learnwithnil.blogspot.com"> Java </a>  ||

  <a href="https://learnwithnil.blogspot.com"> HTML </a>  ||

  <a href="https://learnwithnil.blogspot.com"> C </a>


</body>

</html>


WebPage Output:


Nevigation Bar

Home || Java || HTML || C







                                               End

Comments

  1. javamatrix15 October 2022 at 04:15

    import java.util.Scanner;

    class MulDimArr
    {
    public static void main(String arr[])
    {
    int a,b,n,ch;
    Scanner sc = new Scanner(System.in);
    System.out.println("How many number of rows in matrix:");
    a = sc.nextInt();

    System.out.println("How many number of columns in matrix:");
    b = sc.nextInt();

    int m1[][] = new int[a][b];
    int m2[][] = new int[a][b];
    System.out.println("Enter the 1st matrix:");
    for(int i=0; i<m1.length; i++)
    {
    for(int j=0; j<m1.length; j++)
    {
    // System.out.println("m1[i].length"+m1[i].length);
    m1[i][j] = sc.nextInt();
    }
    }

    System.out.println("1st matrix is:");
    for(int i=0; i<m1.length; i++)
    {
    for(int j=0; j<m1.length; j++)
    {
    // System.out.println("m1[i].length"+m1[i].length);
    System.out.print(m1[i][j]+" ");
    }
    System.out.println();
    }

    System.out.println("Enter the 2st matrix:");
    for(int i=0; i<m2.length; i++)
    {
    for(int j=0; j<m2.length; j++)
    {
    // System.out.println("m1[i].length"+m1[i].length);
    m2[i][j] = sc.nextInt();
    }
    }

    System.out.println("2st matrix is:");
    for(int i=0; i<m2.length; i++)
    {
    for(int j=0; j<m2.length; j++)
    {
    // System.out.println("m1[i].length"+m1[i].length);
    System.out.print(m2[i][j]+" ");
    }
    System.out.println();
    }

    do
    {
    System.out.println("1.Addition:");
    System.out.println("2.Multiplication:");
    System.out.println("3.Transpose of matrix:");
    System.out.println("4.Exit:");

    System.out.println("Plz Enter ur choice:");
    ch = sc.nextInt();

    switch(ch)
    {
    case 1:
    int sum[][] = new int[a][b];
    for(int i=0; i<m2.length; i++)
    {
    for(int j=0; j<m2.length; j++)
    {
    sum[i][j] = m1[i][j] + m2[i][j];
    }

    }

    System.out.println("Addition of m1 and m2:");
    for(int i=0; i<m2.length; i++)
    {
    for(int j=0; j<m2.length; j++)
    {
    System.out.print(sum[i][j]+" ");
    }
    System.out.println();
    }

    case 2:
    int mul[][] = new int[a][b];
    for(int i=0; i<m2.length; i++)
    {
    for(int j=0; j<m2.length; j++)
    {
    mul[i][j] = m1[i][j] * m2[i][j];
    }

    }

    System.out.println("Multiplication of m1 and m2:");
    for(int i=0; i<m2.length; i++)
    {
    for(int j=0; j<m2.length; j++)
    {
    System.out.print(mul[i][j]+" ");
    }
    System.out.println();
    }

    case 3:
    int trn[][] = new int[a][b];
    for(int i=0; i<m1.length; i++)
    {
    for(int j=0; j<m1.length; j++)
    {
    trn[i][j] =m1[j][i];
    }

    }

    System.out.println("Transpose of m1:");
    for(int i=0; i<m1.length; i++)
    {
    for(int j=0; j<m1.length; j++)
    {
    System.out.print(trn[i][j]+" ");
    }
    System.out.println();
    }



    }

    }while(ch!=4);
    }
    }

    ReplyDelete

Post a Comment

hey

Popular posts from this blog

Practical slips programs : Machine Learning

-
                                                     Savitribai Phule Pune University                                         M.Sc.-II (Comp. Sci.) Sem-III Practical Examination -2024-25                  Practical Paper (CS-605-MJP) Lab course on CS-602-MJ Machine Learning                                                     Practical slips programs : Machine Learning Slip 1 : Q.1  Use Apriori algorithm on groceries dataset to find which items are brought together. Use minimum support =...
Read more

Full Stack Developement Practical Slips Programs

-
  Full Stack Developement Practical Slips Programs Slip 1 Create an HTML form for Login and write a JavaScript to validate email ID and Password using Regular Expression.  <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Login Form</title> <style>     /* Add some basic styling for the form */     body {         font-family: Arial, sans-serif;     }     form {         max-width: 300px;         margin: 0 auto;     }     input[type="text"],     input[type="password"],     input[type="submit"] {         width: 100%;         padding: 10px;         margin: 5px 0;         border: 1px solid #ccc;         box-siz...
Read more

MCS Advanced Database & Web Technology

-
Image
  MCS Advanced Database & Web Technology Slip 1: Write the HTML5 code for generating the form as shown below. Apply the internal CSS to the following form to change the font size of the heading to 6pt and change the color to red and also change the background color to yellow. <! DOCTYPE html > < html lang = "en" > < head >     < meta charset = "UTF-8" >     < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >     < title > Project Management Form </ title >     < style >         body {             font-family : Arial , sans-serif ;             background-color : #f8f8f8 ;             margin : 0 ;             padding : 0 ;         }         form {           ...
Read more