Scribd Logo
Upload

Welcome to Scribd!

  • 40 views

    HTML Css Javascript

    Uploaded by

    Priojit
    This document provides an overview of HTML, CSS, and JavaScript. It discusses key topics such as HTML tags and elements, CSS syntax and selectors used to style HTML elements, and how JavaScript can define webpage behavior. An exercise is provided to create a webpage with a table that uses HTML for content, CSS for initial styling, and JavaScript to swap the header and row background colors when a button is clicked.

    Copyright:

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

    You might also like

    HTML Css Javascript

    Uploaded by

    Priojit
    40 views10 pages
    This document provides an overview of HTML, CSS, and JavaScript. It discusses key topics such as HTML tags and elements, CSS syntax and selectors used to style HTML elements, and how JavaScript can define webpage behavior. An exercise is provided to create a webpage with a table that uses HTML for content, CSS for initial styling, and JavaScript to swap the header and row background colors when a button is clicked.

    Original Description:

    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
    This document provides an overview of HTML, CSS, and JavaScript. It discusses key topics such as HTML tags and elements, CSS syntax and selectors used to style HTML elements, and how JavaScript can define webpage behavior. An exercise is provided to create a webpage with a table that uses HTML for content, CSS for initial styling, and JavaScript to swap the header and row background colors when a button is clicked.

    Copyright:

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

    HTML Css Javascript

    Uploaded by

    Priojit
    This document provides an overview of HTML, CSS, and JavaScript. It discusses key topics such as HTML tags and elements, CSS syntax and selectors used to style HTML elements, and how JavaScript can define webpage behavior. An exercise is provided to create a webpage with a table that uses HTML for content, CSS for initial styling, and JavaScript to swap the header and row background colors when a button is clicked.

    Copyright:

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

    HTML CSS JAVASCRIPT

    WorkBuds
    AGENDA

     HTML
     CSS

     JavaScript
    HTML
     HTML stands for Hyper Text Markup Language.
     Extension of HTML file is .htm or .html.

     HTML elements are represented by tags.

     Browsers do not display the HTML tags, but use


    them to render the content of the page.
     Most recent version is HTML 5.

     Tags are of two type :


     Pair
     Empty [Unpaired/Single]
    PAIR TAG
     It has both starting and closing.
     The closing tag has a / slash, it means that the
    tag is closed now.
     It is necessary to close a paired tag.

     List of some paired tags in HTML:

    Starting Tag Closing Tag


    <html> </html>
    <head> </head>
    <title> </title>
    <body> </body>
    <div> </div>
    <table> </table>
    SINGLE TAG
     Unpaired tags are single tags with no closing tag.
     It is recommended to close the unpaired tags
    also.
     An unpaired tag is closed after adding a slash(/)
    just before the greater than > sign. For example:
    <br />.
     Some Unpaired Tags are:

    Open Tag
    <hr>
    <input>
    <meta>
    CSS
     Describes the style of an HTML document.
     Can control the layout of multiple webpages all
    at once.
     CSS can be added to HTML elements in 3 ways:
     Inline: by using the style attribute in HTML
    elements.
     Internal: by using a <style> element in <head>
    section.
     External: by using an external css file. Most
    commonly used way. Extension of external CSS file is
    .css.
    CSS SYNTAX
     A CSS rule-set consists of a selector and a
    declaration block.

    Selector Declaration Declaration

    h3 color : red ; font-size : 10px ;

    Property Value Property Value

    p {
    color : red ;
    text-align : center ;
    }
    CSS SELECTOR
     Used to find (or Select) HTML elements bested on their element
    name, id, class etc.
     Element Selector :
     Selects elements based on their name.
     e.g. p { text-align : center ; color : red ; }
     Id Selector :
     Uses id attribute of an HTML elements to select a specific element.
     Id of an element should be unique within page.
     To select an element write a hash (#) character followed by the id of the
    element.
     e.g. #alpha1 { text-align : right; color : blue ; }
     <p id=“alpha1”>Java EE</p>
     Class Selector :
     Selects elements with a specific class attribute.
     To select element with a specific class, write a period (.) character, followed
    by the name of the class.
     HTML elements can also refer to more than one class.
     e.g. .center { text-align : center; color : white; }
     .large{ text-size : 50px; }
     <p class=“center large”>jee</p>
    JAVASCRIPT
     Programming language for defining behavior of
    WebPages.
     JavaScript can be written by <script> tag in <head>
    or <body> section internal or external.
     Extension of JavaScript External file is .js
     Data type like var.
     Operator like +(Add), -(Minus), *(Multiply),
    /(Division), %(Modulus)
     Keywords like break, continue, for, function etc.
     Functions
     Identifiers : developer defined unique name of
    variable like age, address etc.
     Browsers do not display the JavaScript code, but run
    them on different user events on the browser.
     Translated and not compiled into a binary.
    EXERCISE
     Create a webpage using HTML, CSS and
    JavaScript that will do the following :
    1. HTML page should display a table having three
    headers for First Name, Last Name and Age
    and 2 rows having the values for the above 3
    headers in each row.
    2. The background color of the header should be
    red and the background color of rows should be
    green using CSS.
    3. Add a button below table and give it a name
    ‘swap color’
    4. When someone clicks on this button the color of
    the table header and rows should swap.

    You might also like