Scribd Logo
Upload

Welcome to Scribd!

  • himanshu

    Uploaded by

    hritikraushan4798
    1 views15 pages
    web technology html lab manual

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    web technology html lab manual

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    1 views15 pages

    himanshu

    Uploaded by

    hritikraushan4798
    web technology html lab manual

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 15

    Experiment no.

    :- Date:-

    EXPERIMENT NO-01
    Objective:- Write HTML/Java script code to display your CV.
    Code:-

    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Hritik Raushan - CV</title>

    <style>

    body {

    font-family: Arial, sans-serif;

    margin: 0;

    padding: 20px;

    h1, h2 {

    margin-bottom: 10px;

    p{

    margin-bottom: 5px;

    .section {

    margin-bottom: 20px;

    </style>

    1
    Experiment no.:- Date:-

    </head>

    <body>

    <div>

    <!-- About me -->

    <div class="section">

    <h1>Md Yousuf Alam</h1>

    <p>Email: mdyousuf3644@gmail.com | Phone: 7484888760</p>

    </div>

    <!-- About Education -->

    <div class="section">

    <h2>Education</h2>

    <p>Bachelor of Technology in Computer Science Engineering - Year (Expected 2025)</p>

    <p>GNIOT, Gr Noida, UP</p>

    <p>12Th</p>

    <p>10Th</p>

    </div>

    <!-- About Skill -->

    <div class="section">

    <h2>Skills</h2>

    <p><li>Programming Languages: Java,JavaScript</li></p>

    <p><li>Frameworks/Libraries:React, Node.js, Express,Mongo DB.</li></p>

    <p><li>Frontend Technology:Html,css,JavaScript,React</li></p>

    <p><li>Backend Technology:Java,Js,Node.js, Express,Mongo DB.</li></p>

    2
    Experiment no.:- Date:-

    <p><li>Tools: Git,IJ Idea, VS Code, etc.</li></p>

    <p><li>Postman for API devlopment</li></p>

    </div>

    <!-- About Experience -->

    <!-- About projects -->

    <div class="section">

    <h2>Projects</h2>

    <h3>Resturant website</h3>

    <p>This website mainly used to search different type of foods </p>

    <P>I have created this website in React which is JavaScript Libraries</P>

    <h3>Ecomerce Website</h3>

    <p>This website is simple website which is mainly deal with shopping website

    <br>

    Technology used: HTML,CSS,JS,Node js,Express js,MongoDB and PostMan

    </p>

    <h3>JAVA:Car ShooromSystem</h3>

    <p> This is manily CLI based project which

    <br>

    deal with curd operation to the user

    </p>

    3
    Experiment no.:- Date:-

    </div>

    <!-- About Extra Activities -->

    <div class="section">

    <h2>Extracurricular Activities</h2>

    <p><li>I have solved 250 dsa problem on leetcode</li>

    <br>

    <li>180 problem on coding ninja</li>

    <br>

    <li>400 problem on GFG</li>

    <br>

    <li> Including all i solve more than 800 problems</li>

    </p>

    </div>

    <!-- About Languages-->

    <!-- About References-->

    <div class="section">

    <h2>References</h2>

    <p><li>ChatGPT</li>

    <br>

    <li> StackOverFlow</li>

    <br>

    <li> Google</li>

    <br>

    <li>Google beard AI</li>

    </p>

    </div>

    4
    Experiment no.:- Date:-

    </div>

    </body>

    </html>

    5
    Experiment no.:- Date:-

    OUTPUT:-

    6
    Experiment no.:- Date:-

    EXPERIMENT NO– 2

    Objective:- Write an HTML program to design an entry form of Student details.

    Code:-
    <!-- Html Document Begins-->
    <!DOCTYPE html>
    <html>
    <!-- Header Section-->
    <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>
    Student Registration Form
    </title>
    </head>

    <!--Body of the Webpage-->


    <body bgcolor="orange">

    <!--Start of Form-->
    <div style="margin: auto;width: 30%;">
    <form>
    <h2>Student Registration Form</h2>

    7
    Experiment no.:- Date:-

    <p>Fill in this form to register</p>


    <br>
    <!--Input elemets for form-->
    <label><b>First Name</b></label>
    <input type="text" placeholder="Enter your first name" name="first_name" required>
    <br>

    <br>
    <label><b>Last Name</b></label>
    <input type="text" placeholder="Enter your last name" name="last_name" required>
    <br>
    <br>
    <label><b>E-mail</b></label>
    <input type="email" placeholder="Enter your e-mail" name="email" required>
    <br>
    <br>
    <label><b>Date of Birth</b></label>
    <input type="date" name="dob" required>
    <br>
    <br>
    <label><b>Set Username</b></label>
    <input type="text" placeholder="Set Username" name="username" required>
    <br>
    <br>
    <label><b>Set Password</b></label>
    <input type="password" placeholder="Set password" name="password" required>
    <br>
    8
    Experiment no.:- Date:-

    <br>
    <label><b>Gender</b></label><br>
    <input type="radio" name="gender" value="Male">
    <label for="Male">Male</label><br>
    <input type="radio" name="gender" value="Female">
    <label for="Female">Female</label><br>
    <input type="radio" name="gender" value="Others">
    <label for="Others">Others</label>
    <br>
    <br>
    <label><b>Course :</b></label>
    <select>
    <option value="Course">Course</option>
    <option value="CS">Computer Fundamentals</option>
    <option value="AI">Artificial Intelligence</option>
    <option value="ML">Machine Learning</option>
    <option value="OOPS">Object Oriented Programming</option>
    <option value="DBMS">Database Management System</option>
    </select>
    <br>
    <br>
    <input type="button" value="Register"/>
    </form>
    </div>
    </body>

    </html> <!-- Html Document Ends-->

    9
    Experiment no.:- Date:-

    OUTPUT –

    10
    Experiment no.:- Date:-

    EXPERIMENT NO– 3

    Objective:- Write an XML program using DTD.

    Code:-

    <?xml version = "1.0" standalone="yes"?>


    <!DOCTYPE document [

    <!ELEMENT document (employee)*>

    <!ELEMENT employee (name, hiredate, projects)>

    <!ELEMENT name (lastname, firstname)>


    <!ELEMENT lastname (#PCDATA)>

    <!ELEMENT firstname (#PCDATA)>

    <!ELEMENT hiredate (#PCDATA)>


    <!ELEMENT projects (project)*>

    <!ELEMENT project (product,id,price)>

    <!ELEMENT product (#PCDATA)>


    <!ELEMENT id (#PCDATA)>

    <!ELEMENT price (#PCDATA)>


    ]>
    <document>

    <employee>

    <name>

    <lastname>Kelly</lastname>
    <firstname>Grace</firstname>

    </name>

    <hiredate>October 15, 2005</hiredate>


    <projects>

    <project>

    <product>Printer</product>
    <id>111</id>

    <price>$111.00</price>

    </project>
    <project>
    11
    Experiment no.:- Date:-

    <product>Laptop</product>

    <id>222</id>
    <price>$989.00</price>
    </project>
    </projects>

    </employee>

    <employee>
    <name>

    <lastname>Grant</lastname>

    <firstname>Cary</firstname>
    </name>

    <hiredate>October 20, 2005</hiredate>

    <projects>
    <project>

    <product>Desktop</product>

    <id>333</id>
    <price>$2995.00</price>

    </project>

    <project>
    <product>Scanner</product>

    <id>444</id>

    <price>$200.00</price>
    </project>

    </projects>

    </employee>

    <employee>
    <name>

    <lastname>Gable</lastname>

    <firstname>Clark</firstname>
    </name>
    <hiredate>October 25, 2005</hiredate>

    12
    Experiment no.:- Date:-

    <projects>

    <project>

    <product>Keyboard</product>

    <id>555</id>
    <price>$129.00</price>

    </project>

    <project>
    <product>Mouse</product>

    <id>666</id>

    <price>$25.00</price>
    </project>

    </projects>

    </employee>
    </document>

    OUTPUT:-

    ] > Kelly Grace October 15,

    2005 Printer 111 $111.00 Laptop 222 $989.00 Grant Cary


    October 20,

    2005 Desktop 333 $2995.00 Scanner 444 $200.00 Gable Clark

    October 25,

    2005 Keyboard 555 $129.00 Mouse 666 $25.00

    13
    Experiment no.:- Date:-

    EXPERIMENT NO– 4

    Objective:- Write the program How to get browser details using javascript

    Code:-

    <!DOCTYPE HTML>

    <html>

    <head>

    <title>

    How to get browser details

    </title>

    </head>

    <body>

    <div id="example"></div>

    <script>

    txt

    "<p>Browser CodeName:" + navigator.appCodeName +

    "</p>";

    txt+= "<p>Browser Name: + navigator.appName + "</p>";

    txt+= "<p>Browser Version: " navigator.appVersion +

    "</p>";

    document.getElementById("example").innerHTML=txt;

    </script>

    </body>

    </html>

    14
    Experiment no.:- Date:-

    OUTPUT:-

    Browser CodeName: Mozilla

    Browser Name: Netscape

    Browser Version: 5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko)
    Chrome/123.0.0.0 Safari/537.36

    15

    You might also like