Scribd Logo
Upload

Welcome to Scribd!

  • web 7

    Uploaded by

    SAMI.E. S
    0 views6 pages
    Web 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
    Web 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
    0 views6 pages

    web 7

    Uploaded by

    SAMI.E. S
    Web 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 6

    Exp no :7

    Date :

    CSS Selectors
    Aim : Develop HTML page to includes CSS using different selectors.
    HTML program :

    <html>
    <head>
    <title>Experiment 7</title>
    <link rel=”stylesheet” type=”text/css” href=”expm7.css”>
    </head>
    <body>
    <div class=”container”>
    <h1 >Inline Stylesheet</h1>
    <p id=”inline-description” class=”des1 des3” style=”text
    -decoration:underline”>Inline CSS is the technique to
    define the single element with the insert style sheets in an
    HTML document.
    We can add CSS in three approaches: Inline, Internal, and
    External.
    It has the interactive and unique style to create a single
    HTML element;
    We can define the inline CSS on the style attribute.</p>
    <hr>
    <h2 ><i><u>Internal Stylesheet</u></i></h2>
    <p id=”internal-description”
    class=”description2”><i>Internal CSS is a form of CSS
    using which you can add CSS to HTML documents.
    It helps to design the layout of a single HTML web page
    and change the styles of a web page within HTML
    code.</i></p>
    <hr>
    <h3>External Stylesheet</h3>
    <p id=”external-description” class=”des3”>External CSS is
    a form of CSS which is used to add styling to multiple
    HTML pages at a time.
    It helps to design the layout of many HTML web pages
    simultaneously.
    The external CSS is always saved with the .css extension,
    and through this file, we can change the complete style of
    our HTML web page.</p>
    </div>
    </body>
    </html>
    CSS program :
    Body{
    Background-color: red;
    }
    H1,h3{
    Color:blue;
    }
    H1,h2,h3{
    Text-align: center;
    }
    H2{
    Color:green;
    }
    .container {
    Max-width: 500px;
    Margin: 40px;
    Padding: 10px;
    Background-color: lightblue;
    Border: 1px solid green;
    }

    .des1 {
    Font-size: 1.5em;
    Color: green;
    }
    .description2 {
    Font-size: 1.5em;
    Color: white;
    Padding: 20px;
    Border: 3px solid white;
    }
    .des3 {
    Padding: 20px;
    Border-bottom: 3px dotted blue;
    Border-top: 3px dotted blue;
    }
    #inline-description {
    Background-color: gray;
    }

    #internal-description {
    Background-color: black;
    }

    #external-description {
    Background-color: white;
    }

    Output :
    Result :

    You might also like