Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 72 views

    M3 CSS

    Uploaded by

    Indu Balakrishnan
    To link an external style sheet to an HTML document, the <link> tag is used in the <head> section of the HTML document. The <link> tag requires the following attributes: - rel="stylesheet" - Specifies the relationship between the HTML document and the linked CSS document. - type="text/css" - Specifies the type of document being linked is a CSS file. - href="mystyle.css" - Specifies the path/URL to the external CSS file. So the full code to link an external CSS file called "mystyle.css" would be: <link rel="stylesheet" type="text/css" href="mystyle.css">

    Copyright:

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

    M3 CSS

    Uploaded by

    Indu Balakrishnan
    72 views11 pages
    To link an external style sheet to an HTML document, the <link> tag is used in the <head> section of the HTML document. The <link> tag requires the following attributes: - rel="stylesheet" - Specifies the relationship between the HTML document and the linked CSS document. - type="text/css" - Specifies the type of document being linked is a CSS file. - href="mystyle.css" - Specifies the path/URL to the external CSS file. So the full code to link an external CSS file called "mystyle.css" would be: <link rel="stylesheet" type="text/css" href="mystyle.css">

    Original Description:

    ktu web technology module 3 lecture 1

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    To link an external style sheet to an HTML document, the <link> tag is used in the <head> section of the HTML document. The <link> tag requires the following attributes: - rel="stylesheet" - Specifies the relationship between the HTML document and the linked CSS document. - type="text/css" - Specifies the type of document being linked is a CSS file. - href="mystyle.css" - Specifies the path/URL to the external CSS file. So the full code to link an external CSS file called "mystyle.css" would be: <link rel="stylesheet" type="text/css" href="mystyle.css">

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Download as pptx, pdf, or txt
    72 views11 pages

    M3 CSS

    Uploaded by

    Indu Balakrishnan
    To link an external style sheet to an HTML document, the <link> tag is used in the <head> section of the HTML document. The <link> tag requires the following attributes: - rel="stylesheet" - Specifies the relationship between the HTML document and the linked CSS document. - type="text/css" - Specifies the type of document being linked is a CSS file. - href="mystyle.css" - Specifies the path/URL to the external CSS file. So the full code to link an external CSS file called "mystyle.css" would be: <link rel="stylesheet" type="text/css" href="mystyle.css">

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Download as pptx, pdf, or txt
    of 11

    MODULE 3

    CASCADING STYLE SHEETS (CSS)


    CASCADING STYLE SHEETS (CSS)

    • Levels of Style Sheets


    • Style Specification Formats
    • Selector Forms
    • Property-Value Forms
    • Font Properties
    • List Properties
    • Alignment of Text
    • Color
    • The Box Model
    • Background Images
    • The span and div Tags
    INTRODUCTION

    • HTML specify the content and structure of a


    document.

    • CSS is the W3C technology for formatting and


    presenting the information in the document.

    • Hence the structure ( section headers, body text,


    links etc) can be separated from the presentation
    (font, spacing, colors etc.) which simplifies the
    maintenance and modification of a webpage.
    CASCADING STYLE SHEETS

    • HTML style sheets are called Cascading style sheets


    because they can be defined at three different levels to
    specify the style of the document.

    • Lower-level style sheets can override higher-level style


    sheets.

    • So the style of the content of a tag is determined by a


    cascade of style sheet applications.
    LEVELS OF STYLE SHEETS

    • Inline: lowest level


    –Applies to the content of a single tag

    • Document: intermediate level


    –Applies to the whole body of a document

    • External: highest level


    –Applies to the body of any number of documents
    ORDER OF PRECEDENCE

    highest •Inline styles


    intermediate •Document styles
    lowest •External styles
    INLINE STYLES

    • Used to declare an individual element’s


    format

    –Attribute style
    –CSS property
    – Followed by a colon and a value

    <p style=“color:red; font-family:arial”>


    This paragraph is displayed with syle</p>
    DOCUMENT-LEVEL STYLE SHEETS

    • Document level style specification appear in the document head section


    and appear to the entire body of the document.

    <style type="text/css">
    h1 {
    color: white;
    text-align: center;
    }
    p {
    font-family: verdana;
    font-size: 20px;
    color:darkgreen;
    }
    .special{color:blue;}
    </style>
    EXTERNAL STYLE SHEETS

    – Separate style sheet file with .css extension

    – External style sheets are not part of any documents to which


    they apply

    – They are stored separately and are specified in all documents


    that are meant to use them.

    – External style sheets are written as text files with the MIME
    type text/css

    – External style sheets are used if a style sheet need to be


    applied to more than one document
    LINKING EXTERNAL STYLE SHEETS

    • The <link> tag is used to specify external style sheets.

    • rel attribute is used to specify the relationship of the linked-to


    document to the document in which the link appears.

    • href attribute of the <link> is used to specify the URL of the


    style sheet document.

    <link rel=“stylesheet” type= “text/css”


    href=“mystyle.css”>

    • The link to an external stylesheet must appear in the head of the


    document.
    QUESTION

    • How to link an external style sheets to an HTML document?


    What are the attributes required for that?

    You might also like