Scribd Logo
Upload

Welcome to Scribd!

  • 4 views

    HTML

    Uploaded by

    saurenstha0
    HTML

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    HTML

    Uploaded by

    saurenstha0
    4 views17 pages
    HTML

    Original Title

    html

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    HTML

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    4 views17 pages

    HTML

    Uploaded by

    saurenstha0
    HTML

    Copyright:

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

    Introduction:

    HTML stands for Hypertext Markup Language. It is the standard markup language used to
    create web pages. HTML is a combination of Hypertext and Markup language. Hypertext
    defines the link between web pages. A markup language is used to define the text document
    within the tag to define the structure of web pages.

    This language is used to annotate (make notes for the computer) text so that a machine can
    understand it and manipulate text accordingly. Most markup languages (e.g. HTML) are human-
    readable. The language uses tags to define what manipulation has to be done on the text.

    Advantages of HTML:

    1. HTML is used to build websites.


    2. It is supported by all browsers.
    3. It can be integrated with other languages like CSS, JavaScript, etc.

    Disadvantages of HTML:

    1. HTML can only create static web pages. For dynamic web pages, other languages have
    to be used.
    2. A large amount of code has to be written to create a simple web page.
    3. The security feature is not good.

    Features of HTML

    1. It is easy to learn and easy to use.


    2. It is platform-independent.
    3. Images, videos, and audio can be added to a web page.
    4. Hypertext can be added to the text.
    5. It is a markup language.

    1
    Basic structure of html:
    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="UTF-8">

    <meta name="viewport"

    content="width=device-width, initial-scale=1.0">

    <!--The above meta characteristics make a website

    compatible with different devices. -->

    <title>Demo Web Page</title>

    </head>

    <body>

    <h1>GeeksforGeeks</h1>

    <p>A computer science portal for geeks</p>

    </body>

    </html>

    2
    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

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

    <title>Academy Website</title>

    <style>

    .main{

    width : 50%;

    margin: auto;

    border: 1px solid rgb(0, 0, 0) ;

    padding: 10px;

    html, body {

    margin: 0;

    padding: 0;

    *{

    box-sizing: border-box;

    html,* { font-family: 'Inter'; }

    3
    body { background-color:whitesmoke; line-height:1.6; color: #0f0e0e;}

    </style>

    </head>

    <body>

    <!-- Header section -->

    <header>

    <h1>welcome to saugat's website</h1>

    <nav class="navbar navbar-expand-lg navbar-light bg-light">

    <div class="container-fluid">

    <form class="d-flex">

    <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">

    <button class="btn btn-outline-success" type="submit">Search</button>

    </form>

    <div class="collapse navbar-collapse" id="navbarSupportedContent">

    <ul class="navbar-nav me-auto mb-2 mb-lg-0">

    <li class="nav-item">

    <a class="navbar-brand" href="./orderedandunodered,.html">list </a>

    </li>

    <li class="nav-item">

    <a class="nav-link active" aria-current="page"


    href="./registrationform.html">registrationform</a>

    </li>

    4
    <li class="nav-item">

    <a class="nav-link" href="contactu.html">contact</a>

    </li>

    <li class="nav-item dropdown">

    <a class="nav-link dropdown-toggle" href="./table6.html ">table</a>

    <ul class="dropdown-menu" aria-labelledby="navbarDropdown">

    </ul>

    </li>

    </ul>

    </div>

    </div>

    </nav>

    </header>

    </html>

    5
    6
    Code of orderedlistandunorderedlist.html:

    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

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

    <title>Document</title>

    <style>

    body{

    width: 50%;

    margin: auto;

    border: 1px solid rgb(0, 0, 0);

    background:#e7e9e8;

    </style>

    </head>

    <body>

    <h1>list</h1>

    <p>name of football players</p>

    <ol>

    <li>messi</li>

    <li>ronaldo</li>

    <li>neymar</li>

    7
    </ol>

    <ul>

    <p>their fav car </p>

    <li>g-wagon</li>

    <li>bugati</li>

    <li>bmw</li>

    </ul>

    <h2>current playing team</h2>

    <dl>

    <dd>inter miami</dd>

    <dd>AL-nassar</dd>

    <dd>al-hilal</dd>

    </dl>

    </body>

    </html>

    Image of orderedandunorderedlist.html:
    8
    Code of registrationform.html:

    9
    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

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

    <title>Document</title>

    <style>

    h1{

    text-align: center;

    .child2{

    width: 50%;

    margin: auto;

    border: 1px solid rgb(0, 0, 0);

    background:#eeff00;

    .parent {

    border: 1px solid black;

    margin: 1rem;

    padding: 2rem;

    text-size-adjust: 6px;

    10
    </style>

    </head>

    <body>

    <h1 style="color: slategrey;text-justify: auto;">Registration form</h1>

    <div class="child2">

    <label> Firstname </label>

    <input type="text" name="firstname" size="15"/> <br> <br>

    <label> Middlename: </label>

    <input type="text" name="middlename" size="15"/> <br> <br>

    <label> Lastname: </label>

    <input type="text" name="lastname" size="15"/> <br> <br>

    <br>

    <br>

    <label>

    Gender :

    </label><br>

    <input type="checkbox" name="male"/> Male <br>

    <input type="checkbox" name="female"/> Female <br>

    <input type="checkbox" name="other"/> Other

    <br>

    <br>

    <label>

    11
    Phone :

    </label>

    <input type="text" name="country code" value="+977" size="2"/>

    <input type="text" name="phone" size="10"/> <br> <br>

    <br>

    <label for="Address">Address</label>

    <input type="text" name="address " size="15"/> <br> <br>

    <br> <br>

    Email:

    <input type="email" id="email" name="email"/> <br>

    <br> <br>

    Password:

    <input type="Password" id="pass" name="pass"> <br>

    <br> <br>

    Re-type password:

    <input type="Password" id="repass" name="repass"> <br> <br>

    <input type="button" value="Submit"/>

    </form>

    <script src="./bootstrap-5.3.0-dist/js/bootstrap.bundle.js"></script>

    </body>

    </html>

    12
    Image of registrationform.html:

    Code for table6.html:

    13
    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="UTF-8">

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

    <title>Document</title>

    <style>

    .main{

    width : 50%;

    margin: auto;

    border: 1px solid rgb(0, 0, 0) ;

    padding: 10px;

    table,tr,td,th{

    border:1px solid rgb(0, 0, 0);

    border-collapse: collapse;

    table{

    width: 50%;

    margin: auto;

    td{

    padding: 5px;

    14
    }

    </style>

    </head>

    <body>

    <div class="main">

    <table style="width:100%">

    <caption>list of students</caption>

    <tr>

    <th rowspan="2" width="20%">s.n</th>

    <th colspan="2 "weidth=40%>Name </th>

    <tr>

    <th>first name</th>

    <th>last name </th>

    <tr>

    <tr>

    <td rowspan="2">1.</td>

    <td>saugat</td>

    <td>pandey</td>

    </tr>

    15
    <tr>

    <td>sauren</td>

    <td>shrestha</td>

    </tr>

    <tr>

    <tr>

    <tr>

    <td rowspan="2">2.</td>

    <td>naveen</td>

    <td>panday</td>

    </tr>

    <tr>

    <td>parthak</td>

    <td>kandel</td>

    </tr>

    </table>

    </div>

    </body>

    </html>

    16
    Image of table6.html:

    17

    You might also like