Scribd Logo
Importer

Bienvenue sur Scribd !

  • HTML

    Transféré par

    PiyushMaru
    39 vues23 pages
    HTML ppt

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PPTX, PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document
    HTML ppt

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PPTX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    39 vues23 pages

    HTML

    Transféré par

    PiyushMaru
    HTML ppt

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PPTX, PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 23

    HTML

    What is HTML?
    HTML is amarkuplanguage
    fordescribingweb documents (web
    pages).
    HTML stands
    forHyperTextMarkupLanguage
    A markup language is a set ofmarkup tags
    HTML documents are described byHTML
    tags
    Each HTML tagdescribesdifferent
    document content
    HTML Tags <tagname>content</tagname>

    <!DOCTYPEhtml> TheDOCTYPEdeclaration defines the document


    <html> type to be HTML
    <head> The text
    <title>Page between<html>and</html>describes an
    Title</title> HTML document
    </head> The text between<head>and</head>provides
    <body> information about the document
    The text between<title>and</title>provides a
    <h1>My First title for the document
    Heading</h1> The text
    <p>My first between<body>and</body>describes the
    paragraph.</p> visible page content
    The text between<h1>and</h1>describes a
    </body> heading
    </html> The text between<p>and</p>describes a
    paragraph
    HTMLEditors
    Write HTML Using Notepad or TextEdit
    Run HTML Programs
    Open the saved HTML file in your favourite
    browser. The result will look much like this:
    HTML Basics
    HTML Links
    <ahref="http://www.w3schools.com">This is a link</a>
    HTML Images
    <imgsrc="w3schools.jpg"alt="W3Schools.com"width="
    104"height="142">
    HTML Background Color
    <bodystyle="background-color:lightgrey;">
    HTML Text Color
    <h1style="color:blue;">This is a heading</h1>
    <pstyle="color:red;">This is a paragraph.</p>
    HTML Fonts
    <h1style="font-family:verdana;">This is a
    heading</h1>
    <pstyle="font-family:courier;">This is a paragraph.</p>
    HTML Basics
    HTML Text Size
    <h1style="font-size:300%;">This is a
    heading</h1>
    <pstyle="font-size:160%;">This is a
    paragraph.</p>
    HTML Text Alignment
    <h1style="text-align:center;">Centered
    Heading</h1>
    <p>This is a paragraph.</p>
    HTMLText Formatting Elements
    <p><b>This text is bold</b>.</p>
    Tag Description
    <b> Defines bold text
    <em> Defines emphasized text
    <i> Defines italic text
    <small> Defines smaller text
    <strong> Defines important text
    <sub> Defines subscripted text
    <sup> Defines superscripted text
    <ins> Defines inserted text
    <del> Defines deleted text
    <mark> Defines marked/highlighted text
    HTML Table Example
    <table>
    <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
    </tr>
    <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
    </tr>
    </table>
    HTML Table Example
    <tableborder="1">
    <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
    </tr>
    <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
    </tr>
    </table>
    HTML Table Example
    <tableborder="1">
    <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
    </tr>
    <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
    </tr>
    </table>
    Table With Heading
    <table >
    <td>Eve</td>
    <tr>
    <td>Jackson</td>

    <th>Firstname</th>
    <td>94</td>
    </tr>
    <th>Lastname</th>
    <tr>
    <th>Points</th>
    <td>John</td>
    </tr>
    <td>Doe</td>
    <tr>
    <td>Jill</td>
    <td>80</td>
    <td>Smith</td>
    </tr>
    </table>
    <td>50</td>
    </tr>
    </body>
    <tr>
    HTML Forms
    The <form> Element
    HTML forms are used to collect user input.
    The<form>element defines an HTML form:
    HTML forms containform elements.
    Form elements are different types of input
    elements, checkboxes, radio buttons, submit
    buttons, and more.
    HTML Form Elements
    Tag Description
    <form> Defines an HTML form for user input
    <input> Defines an input control
    <textarea> Defines a multiline input control (text area)
    <label> Defines a label for an <input> element
    <fieldset> Groups related elements in a form
    <legend> Defines a caption for a <fieldset> element
    <select> Defines a drop-down list
    <optgroup Defines a group of related options in a drop-down list
    >
    <option> Defines an option in a drop-down list
    <button> Defines a clickable button
    <datalist> Specifies a list of pre-defined options for input controls
    <output> Defines the result of a calculation
    HTML Form Elements
    Text Input
    <form>
    First name:<br>
    <inputtype="text"name="firstname"><br>
    Last name:<br>
    <inputtype="text"name="lastname">
    </form>
    Radio Button Input
    <form>
    <inputtype="radio"name="gender"value="male"
    checked>Male<br>
    <inputtype="radio"name="gender"value="femal
    e">Female<br>
    <inputtype="radio"name="gender"value="other"
    >Other
    </form>
    HTML Form Elements
    The Submit Button
    <formaction="action_page.php">
    First name:<br>
    <inputtype="text"name="firstname"value="Mickey"><br>
    Last name:<br>
    <inputtype="text"name="lastname"value="Mouse"><br><br>
    <inputtype="submit"value="Submit">
    </form>
    The Action Attribute
    Theaction attributedefines the action to be
    performed when the form is submitted.
    The common way to submit a form to a server, is by
    using a submit button.
    Normally, the form is submitted to a web page on a web
    server.
    <formaction="action_page.php"method="get">
    HTML Form Elements
    The Name Attribute
    <formaction="action_page.php">
    First name:<br>
    <inputtype="text"value="Mickey"><br>
    Last name:<br>
    <inputtype="text"name="lastname"value="Mouse"><br><br
    >
    <inputtype="submit"value="Submit">
    </form>
    HTML Form Elements
    Grouping Form Data with <fieldset>
    <formaction="action_page.php">
    <fieldset>
    <legend>Personal information:</legend>
    First name:<br>
    <inputtype="text"name="firstname"value="Mickey"><br>
    Last name:<br>
    <inputtype="text"name="lastname"value="Mouse"><br><br>
    <inputtype="submit"value="Submit">
    </fieldset>
    </form>
    HTML Form Elements
    The <select> Element (Drop-Down List)
    <selectname="cars">
    <optionvalue="volvo">Volvo</option>
    <optionvalue="saab">Saab</option>
    <optionvalue="fiat">Fiat</option>
    <optionvalue="audi">Audi</option>
    </select>
    HTML Form Elements
    The <textarea> Element
    <textareaname="message"rows="10"col
    s="30">
    The cat was playing in the garden.
    </textarea>
    HTML Form Elements
    The <button> Element
    <buttontype="button"onclick="alert('Hello
    World!')">Click Me!</button>
    HTML Form Elements
    HTML 5 <datalist>
    <form action="action_page.php">
    <input list="browsers" name="browser">
    <datalist id="browsers">
    <option value="Internet Explorer">
    <option value="Firefox">
    <option value="Chrome">
    <option value="Opera">
    <option value="Safari">
    </datalist>
    <input type="submit">
    </form>
    HTML Form Elements
    HTML5 <output> Element
    <formaction="action_page.asp"
    oninput="x.value=parseInt(a.value)
    +parseInt(b.value)">
    0
    <inputtype="range" id="a"name="a"value="50">
    100 +
    <inputtype="number"id="b"name="b"value="50">
    =
    <outputname="x"for="a b"></output>
    <br><br>
    <inputtype="submit">
    </form>

    Vous aimerez peut-être aussi