Nothing Special   »   [go: up one dir, main page]
Scribd Logo
Upload

Welcome to Scribd!

  • 2K views

    Css Practical File

    Uploaded by

    archana awasthi
    This document provides examples of using different CSS properties including internal and external style sheets, styling images with borders, adding links and hover effects, and using the outline property. The examples demonstrate how to change text and background colors, font sizes, image borders, link colors on hover and active states, and outline thickness. CSS is used to style and lay out elements on HTML pages.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd

    Css Practical File

    Uploaded by

    archana awasthi
    2K views7 pages
    This document provides examples of using different CSS properties including internal and external style sheets, styling images with borders, adding links and hover effects, and using the outline property. The examples demonstrate how to change text and background colors, font sizes, image borders, link colors on hover and active states, and outline thickness. CSS is used to style and lay out elements on HTML pages.

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This document provides examples of using different CSS properties including internal and external style sheets, styling images with borders, adding links and hover effects, and using the outline property. The examples demonstrate how to change text and background colors, font sizes, image borders, link colors on hover and active states, and outline thickness. CSS is used to style and lay out elements on HTML pages.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    2K views7 pages

    Css Practical File

    Uploaded by

    archana awasthi
    This document provides examples of using different CSS properties including internal and external style sheets, styling images with borders, adding links and hover effects, and using the outline property. The examples demonstrate how to change text and background colors, font sizes, image borders, link colors on hover and active states, and outline thickness. CSS is used to style and lay out elements on HTML pages.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    You are on page 1of 7

    FACULTY OF NURSING

    PRACTICAL FILE OF WEB DESIGNING &


    INTERNET TECHNOLOGY

    SUBMITTED TO : SUBMITTED BY:


    Dr. Ashok Kumar Archana Awasthi
    Banasthali Vidyapith Bsc. Nursing 3rdyear

    Roll no. 1912179

    ID. MDBSN19020
    1. INTERNAL STYLE SHEET-
    <html>
    <head>
    <title>HTML INTERNAL CSS</title>
    <style type = “ text/css>
    .red{
    Color: red;
    }
    .thick{
    Font – size: 20px:; }
    .green{
    Color:green;
    }
    </style>
    </head>
    <body>
    <p class= “red”> This is red </p>
    <p class=“thick”>This is thick</p>
    <p class=“green”>This is green</p>
    <p class=“thick green”> This is thick and green</p>
    </body>
    </html>

    EXAMPLE-
    <head>
    <style>
    body {background- color : powerblue;}
    h1 {color: blue;}
    p {color: red;}
    </style>
    </head>
    2- EXTERNAL STYLE SHEET
    <html>
    <head>
    <LINK REL=STYLESHEET HREF= “mystyle.css Type=
    “text/css”></head>
    <body>
    <h1>Hello how are you ?<h1>
    Welcome
    </body>
    </html>
    3. USING IMAGES-
    <html>
    <head>
    </head>
    <body>
    <img style= “border:0px;” src=
    “/css/images/logo.png”/>
    <br />
    <img style = “border:3px dashed red ; “
    src=”/css/images/logo.png />
    <img style= “border:1px solid red ; height:100px; “
    src=”/css/images/logo.png”/>
    </body>
    </html>
    Solid/dashed/dotted
    Img {
    border: 1px dotted red;
    border – radius:25px;
    padding: 25px;
    width: 150px;
    //to display in center display: block;
    margin: right: auto;

    4. ADD LINK
    <html>
    <head>
    <style type= “type/css>
    a: visited { color: #000000}
    a:hover {color: #006600}
    a:active {color: #FFCC00}
    </style>
    </head>
    <body>
    < a href= “”>Link</a>
    </body>
    <html>
    5. THE OUTLINE WIDTH PROPERTY
    <html>
    <head>
    </head>

    <body>
    <p style= “outline- width:thin; outline –
    style:solid;>solid>
    </p>
    <br />

    <p style = “outline – width:thick; outline-style: solid;”>


    This text is having thick outline.
    </p>
    <br />

    <p style= “outline-width:5px; outline-style:solid;”>


    This text is having 5x outline.
    </p>
    </body>
    </html>

    You might also like