Scribd Logo
Upload

Welcome to Scribd!

  • HTML and Css

    Uploaded by

    Rachna Lal
    4 views3 pages

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

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

    HTML and Css

    Uploaded by

    Rachna Lal

    Copyright:

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

    HTML Tags Type -

    1. Single Line Tag


    2. Paired Tag
    3. Nested Tag

    Single Line Tag - don't require the closing tag

    <hr> , <br>

    Paired Tag - requires Closing Tag also -

    <h2>Welcome </h2>

    Nested Tag - It is tag inside another tag

    <marquee> <h2>Welcome </h2> </marquee>

    ex.

    <marquee> <h2>50% discount of Electronic Items </h2></marquee>

    Tag Syntax -

    <input type="text" />

    input - tag
    type - attribute i.e. specify the behaviour
    text - value

    HTML tags Category -

    1. Form Designing / User Interface - textbox, checkbox, radiobutton, image, button


    2. Formatting Tag - bold, italic, underline, marquee, font etc.
    3. Layout - to set the layout of the page - table , div, section etc.
    4. command tag - hyperlink, heading tag , image

    ex. of Type Attribute

    <input id="Text1" type="text" />


    <input id="Text1" type="checkbox" />
    <input id="Text1" type="radio" />
    <input id="Text1" type="submit" />
    <input id="Text1" type="date" />
    <input id="Text1" type="color" />
    <input id="Text1" type="email" />

    ex. of required attribute

    <asp:TextBox ID="TextBox1" runat="server" required


    OnTextChanged="TextBox1_TextChanged"></asp:TextBox>

    ex. of placeholder

    <asp:TextBox ID="TextBox1" runat="server" required placeholder="enter username"


    OnTextChanged="TextBox1_TextChanged"></asp:TextBox>
    ex. of MaxLength

    <asp:TextBox ID="TextBox1" runat="server" required placeholder="enter username"


    OnTextChanged="TextBox1_TextChanged" MaxLength="10"></asp:TextBox>

    ex. of ReadOnly

    <asp:TextBox ID="TextBox2" runat="server" readonly="true" Text="email"


    placeholder="enter username" OnTextChanged="TextBox1_TextChanged"
    MaxLength="10"></asp:TextBox>

    Id - to give a unique ID to all the controls in the page

    TextBox = txt
    Radio - opt
    CheckBox - chk
    button - btn
    image - img
    dropdown - drp
    listbox - lst
    panel - pnl
    Hyperlink - hyp

    style - to provide styling related information i.e. color, size, width, height etc.

    ex.

    <asp:Button ID="btnsubmit" runat="server" OnClick="Button1_Click" Text="Submit"


    style="background-color:blue;color:white;padding:5px;border-radius:10px;" />

    ex.

    <body style="background-color:cyan;">

    ex.

    <asp:Image ID="Image1" runat="server" ImageUrl="~/12.jpg"


    style="height:250px;width:250px;border:double;" />

    ex.

    <asp:TextBox ID="txtusername" runat="server" required placeholder="enter


    username" OnTextChanged="TextBox1_TextChanged" pattern="[a-z]{3,10}" title="enter
    only a-z" MaxLength="10" Style="background-color:yellow;"></asp:TextBox>

    ex. of Pattern and Title

    Pattern to specify the valid input char set

    [ - ] - [a-z]
    [A-Z]
    [0-9]
    [a-zA-Z]
    [A-Za-z0-9]

    <asp:TextBox ID="txtusername" runat="server" required placeholder="enter


    username" OnTextChanged="TextBox1_TextChanged" pattern="[a-z]{3,10}" title="enter
    only a-z" MaxLength="10"></asp:TextBox>
    + Validation
    + Formatting

    HTML 5

    Default.aspx code -

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs"


    Inherits="WebApplication36.WebForm1" %>

    <!DOCTYPE html>

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <title></title>
    </head>
    <body style="background-color:cyan;">
    <marquee> <h2>50% discount of Electronic Items </h2></marquee>
    <form id="form1" runat="server">
    <div>

    </div>
    <asp:TextBox ID="txtusername" runat="server" required="true"
    placeholder="enter username" OnTextChanged="TextBox1_TextChanged" pattern="[a-z]
    {3,10}" title="enter only a-z" MaxLength="10" Style="background-
    color:yellow;"></asp:TextBox>
    <p>
    <input id="txtpassword" type="password" placeholder="enter
    password" /></p>
    <asp:Button ID="btnsubmit" runat="server" OnClick="Button1_Click"
    Text="Submit" style="background-color:blue;color:white;padding:5px;border-
    radius:10px;" />

    <p>
    <asp:TextBox ID="TextBox2" runat="server" readonly="true" Text="email"
    placeholder="enter username" OnTextChanged="TextBox1_TextChanged"
    MaxLength="10"></asp:TextBox>
    </p>
    <p>
    &nbsp;</p>
    <p>
    &nbsp;</p>
    <asp:Image ID="Image1" runat="server" ImageUrl="~/12.jpg"
    style="height:250px;width:250px;border:double;" />
    </form>
    </body>
    </html>

    You might also like