Scribd Logo
Hochladen

Willkommen bei Scribd!

  • HTML Introduction

    Hochgeladen von

    Mahathir Jeshan
    20 Ansichten20 Seiten
    It's a presentation for introduction to html and html document. It also covered the introduction to HTML5.

    Originaltitel

    HTML Introduction.pptx

    Copyright

    © © All Rights Reserved

    Verfügbare Formate

    PPTX, PDF, TXT oder online auf Scribd lesen

    Stufen Sie dieses Dokument als nützlich ein?

    Sind diese Inhalte unangemessen?

    Dieses Dokument melden
    It's a presentation for introduction to html and html document. It also covered the introduction to HTML5.

    Copyright:

    © All Rights Reserved
    Als PPTX, PDF, TXT herunterladen oder online auf Scribd lesen
    Markieren Sie unangemessene Inhalte
    20 Ansichten20 Seiten

    HTML Introduction

    Hochgeladen von

    Mahathir Jeshan
    It's a presentation for introduction to html and html document. It also covered the introduction to HTML5.

    Copyright:

    © All Rights Reserved
    Als PPTX, PDF, TXT herunterladen oder online auf Scribd lesen
    Markieren Sie unangemessene Inhalte
    von 20

    CT250: HTML & HTML5

    ECTS: = 36/25-30
    Length Of Course: 36
    hours
    Prerequisites: CT 100
    Trial Month

    HTML & HTML5

    Week

    Day

    HTML Introduction

    HTML : HYPER TEXT MARKUP LANGUAGE


    - HTML is a Document That Contains Text
    - Web Browsers Read and Display Documents That Contain HTML

    TML Introduction (Cont.)

    <> : Angle Brackets Contain Tag


    <html>Something</html> : Markup Element

    HTML Tags, Elements


    and their Usage
    - Editors
    - Starting Basic
    - Elements

    HTML Editor
    Netbeans 8.0:
    https://netbeans.org/downloads/
    Java Development Kit 8 (JDK):
    http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
    Notepad++:
    http://download.tuxfamily.org/notepadplus/6.7.1/npp.6.7.1.Installer.exe
    Sublime Text Editor:
    http://c758482.r82.cf2.rackcdn.com/Sublime%20Text%202.0.2.zip

    HTML Starting Basic


    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session
    1</title>
    </head>
    <body>
    <h1>Hello!
    Students</h1>
    </body>
    </html>

    HTML Tags, Elements


    and their Usage (Cont.)
    - Attributes
    - Headings
    - Paragraphs

    ML Attributes, Headings & Paragraphs


    <! DOCTYPEhtml>
    <html lang=en-US>
    <head>
    <title>HTML Session 1</title>
    <metacharset="UTF-8">
    </head>
    <body>
    <h1>Hello! Students</h1>
    <hr>
    <p title=Biography of Rifat>Rifat

    completed his B.Sc. in EEE from United International University


    (UIU). Currently he studies PGD in ICT (IICT Department) at BUET.
    He has also completed four professional courses from Basis, BDJOBS
    Training & Talha Training on Laravel Framework, Wordpress
    Customization, Object Oriented Programming (OOP), and PHP
    CodeIigniter (CI) Framework for Web Applications etc.

    </p>
    </body>
    </html>

    HTML Tags, Elements


    and their Usage (Cont.)
    - Styles
    - Formatting
    - Quotations

    HTML Styles
    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session
    1</title>
    </head>
    <body bgcolor=white>
    <h1 style=text-align:
    center>Hello!
    Students</h1>
    </body>
    </html>

    HTML Formatting & Quotations


    <! DOCTYPEhtml>
    <html lang=en-US>
    <head>
    <title>HTML Session 1</title>
    <metacharset="UTF-8">
    </head>
    <body>
    <h1>Hello! Students</h1><hr>
    <p title=Biography of Rifat>

    <b>Name: </b>
    <em>Rifat</em><br>
    <strong>Designation:</strong>
    <i>Mentor</i>
    </p>
    <p><mark>This is</mark> <q>HTML
    Formatting</q></p>
    </body>
    </html>

    HTML Tags, Elements


    and their Usage (Cont.)
    - Comments
    - HTML CSS
    - Links & Images

    HTML Comments
    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session
    1</title>
    </head>
    <!-- Start Body Tag -->
    <body bgcolor=white>
    <h1 style=text-align:
    center>Hello! Students</h1>
    </body>
    <!-- Ending Body Tag -->
    </html>

    HTML CSS

    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session 1</title>
    <style>
    body{
    background-color: oldlace;
    font-family: arial;
    font-size: 12px;
    }
    </style>
    </head>
    <!-- Start Body Tag -->
    <body>
    <h1 style=text-align:
    center>Hello! Students</h1>
    </body>
    <!-- Ending Body Tag -->
    </html>

    HTML Links & Images


    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session 1</title>
    </head>
    <body>
    <h1 >Hello! Students</h1>
    <p>This Layout was Design by <a
    href=www.coderstrust.com>
    CodersTrust Bangladesh</a>
    </p>
    <p><imgsrc=logo.gif"alt=CodersT
    rust Bangladesh"></p>
    </body>
    </html>

    HTML Tags, Elements


    and their Usage (Cont.)
    - Tables
    - Lists

    HTML Tables
    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session 2</title>
    </head>
    <body >
    <h1 >Product Category</h1>
    <table>
    <tr>
    <th>Product Name</th>
    <th>Price</th>
    <tr>
    <tr>
    <td>Dell Computer</td>
    <td>$250</td>
    <tr>
    </table>
    </body>
    </html>

    tr = Table Row
    td = Table Data
    th = Table Heading

    HTML Tables (Cont.)


    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session 2</title>
    </head>
    <body >
    <h1 >Product Category</h1>
    <table>
    <tr>
    <th>Product Name</th>
    <th colspan="2" >Price</th>
    <tr>
    <tr>
    <td>Dell Computer</td>
    <td>$250</td>
    <td>$350</td>
    <tr>
    </table>
    </body>
    </html>

    colspan
    rowspan

    HTML Ordered & Unordered Lists


    <! DOCTYPEhtml>
    <html>
    <head>
    <title>HTML Session 2</title>
    </head>
    <body >
    <h1 >Ordered & Unordered Lists</h1>
    <!-- Unordered List Start -->
    <ul>
    <li> Name </li>
    <li> Designation </li>
    </ul>
    <!-- Unordered List End-->
    <!-- Ordered List Start -->
    <ol>
    <li> Name </li>
    <li> Designation </li>
    </ol>
    <!-- Ordered List End-->
    </body>
    </html>

    Unordered List Ordered List

    <ul>
    <li>
    li = List Item

    <ol>
    </li>

    Das könnte Ihnen auch gefallen