Scribd Logo
Upload

Welcome to Scribd!

  • CSS Rule: Selector Declaration Block

    Uploaded by

    brucebinh
    9 views7 pages
    css pro

    Original Title

    Css

    Copyright

    © © All Rights Reserved

    Available Formats

    PPT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    css pro

    Copyright:

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

    CSS Rule: Selector Declaration Block

    Uploaded by

    brucebinh
    css pro

    Copyright:

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

    CSS Rule

    Selector

    Declaration Block

    body {
    font-family: Tahoma, Arial, sans-serif;
    color: black;
    background: white;
    margin: 8px;
    }

    Value
    Attribute Name

    CS 142 Lecture Notes: C

    Slide 1

    Adding Styles to HTML


    Separate Stylesheet
    <head>
    ...
    <link rel="stylesheet" type="text/css" href="myStyles.css" />
    <style type="text/css">
    body {
    font-family: Tahoma, Arial, sans-serif;
    ...
    }
    </style>
    </head>
    <body>
    Page-Specific Styles
    ...
    <div style=padding:2px; ... ">
    ...
    </body>

    Element-Specific Styles
    CS 142 Lecture Notes: C

    Slide 2

    CSS:

    HTML:

    body {
    font-family: Tahoma, Arial, sans-serif;
    font-size: 13px;
    color: black;
    background: white;
    margin: 8px;
    }
    h1 {
    font-size: 19px;
    margin-top: 15px;
    margin-bottom: 5px;
    border-bottom: 1px solid black
    }
    .shaded {
    background: #d0d0ff;
    }

    <body>
    <h1>First Section Heading</h1>
    <p>
    Here is the first paragraph, containing
    text that really doesn't have any use
    or meaning; it just prattles on and on,
    with no end whatsoever, no point to
    make, really no purpose for existence
    at all.
    </p>
    <div class="shaded">
    <h1>Another Section Heading</h1>
    <p>
    Another paragraph.
    </p>
    </div>
    </body>

    CS 142 Lecture Notes: C

    Slide 3

    CSS Color Specifiers


    Predefined names:
    white black red

    8-bit hexadecimal intensities for red, green, blue:

    #ff0000
    R G B

    0-255 decimal intensities:

    rgb(255,255,0)
    R

    Percentage intensities:

    rgb(80%,80%,100%)
    R

    B
    CS 142 Lecture Notes: C

    Slide 4

    CSS Element Boxes


    Parents background covers margin

    Border

    Margin

    Element
    Padding
    Content

    Padding

    Elements background covers padding


    CS 142 Lecture Notes: C

    Slide 5

    CSS Distances
    2px

    pixels

    1mm

    millimeters

    2cm

    centimeters

    0.2in

    inches

    3pt

    printers points

    2em, 4ex

    other printers units

    CS 142 Lecture Notes: C

    Slide 6

    CS 142 Lecture Notes: C

    Slide 7

    You might also like