Scribd Logo
Upload

Welcome to Scribd!

  • Css

    Uploaded by

    babablacksheep312886
    94 views1 page
    CSS Syntax Selector - HTML element Declarations; Declarations. Uses id attribute of HTML element e.g. #para1 text-align: center.class selector - style for a group of elements.

    Original Description:

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    CSS Syntax Selector - HTML element Declarations; Declarations. Uses id attribute of HTML element e.g. #para1 text-align: center.class selector - style for a group of elements.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    94 views1 page

    Css

    Uploaded by

    babablacksheep312886
    CSS Syntax Selector - HTML element Declarations; Declarations. Uses id attribute of HTML element e.g. #para1 text-align: center.class selector - style for a group of elements.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 1

    CSS Syntax list-style-type: none, disk, square, circle, decimal, decimal-leading-

    Selector – HTML element {Declarations; Declarations.. } zero, armenian, georgian, lower-alpha, upper-greek,…
    Declaration – Property: Value
    CSS Box Model
    Id Selector – uses id attribute of HTML element
    e.g. #para1 {text-align: center}
    e.g.
    Class Selector – style for a group of elements div.ex
    e.g. .center {color: red} or p.center {color: red} { width:220px;
    padding:10px;
    External Style Sheet border:5px solid gray;
    <head> margin:0px;
    <link rel="stylesheet" type="text/css" href="mystyle.css" /> }
    </head>
    Internal Style Sheet
    <style type = “text/css”> h1 {color:blue} </style> CSS Border
    Inline Styles border-width: thin, thick, medium, length,
    <h1 style = “color:blue; font-size: 12px;}> border-style: none, hidden, dotted, dashed, solid, double, groove,
    ridge, inset, outset,
    Style Priority : border-color
    1) Inline Style (inside HTML element) border-bottom, border-top, border-left, border-right : set
    2) Internal Style Sheet (head section) individual width, style, color
    3) External Style Sheet
    4) Browser Default CSS Outline, Margin, Padding
    outline-color, outline-style, outline-width
    CSS Background margin-top, margin-left, margin-bottom, margin-right
    e.g. body {background-image:url('paper.gif')} padding-top, padding-left, padding-bottom, padding-right
    background-attachment: scroll, fixed,
    background-color: yellow, #hex, rgb(0,0,0), transparent CSS Dimension
    background-image: url(URL), none, height, max-height, min-height, min-width, width
    background-position: top left, top center, … , x% y%, xpos ypos CSS Classification
    background-repeat: repeat, repeat-x, repeat-y, no-repeat e.g. p {display: inline;}
    CSS Text display: block, inline, inline-table, list-item, run-in, table, table-
    e.g. h1 {text-align:center} caption, table-cell, table-column, table-column-group, table-
    p {text-indent: 50px} footer-group, table-header-group, table-row, table-row-group
    color visibility: visible, hidden, collapse
    direction: ltr,rtl CSS Positioning
    line-height: %,length,number e.g. p {position: fixed; top: 50px; bottom: 20px}
    letter-spacing: length position: absolute, fixed, relative, static, inherent
    text-align: left, right, center, justify cursor: url, auto, crosshair, default, pointer, move, e-resize, ne-
    text-decoration: none, underline, overline, line-through, blink resize, nw-resize, n-resize, se-resize, sw-resize, s-resize, w-resize,
    text-indent: length, % text, wait, help
    text-shadow: none, color, length overflow: visible, hidden, scroll, auto
    text-transform: none, capitalize, uppercase, lowercase clip: rect(top, right, bottom, left), auto
    vertical-align: length, %
    word-spacing: length CSS Float
    clear: left, right, both, none, //no floating element allowed on
    CSS Font specified side
    font-family: “times”, “courier”, … , “serif”, “sans-serif”, … float: left, right, none
    font-size: xx-small, x-small, small, medium, large, x-large, xx-large,
    smaller, larger, length, % CSS Pseudo
    font-style: normal, italic, oblique, e.g. selector:pseudo-class {property:value}
    font-variant: normal, small-caps, :active, :first-child, :focus, :hover, :lang, :link, :visited
    font-weight: normal, bold, bolder, lighter, 100,…,900, e.g. selector:pseudo-element {property:value}
    :after, :before, :first-letter, :first-line
    CSS Link
    e.g. a:link {color:#hex; text-decoration:none; background- CSS Image
    color:#hex} opacity:0.6 //firefox
    a: link, visited, hover, active filter:alpha(opacity=60) //for IE
    onmouseover = “this.style.opacity=1;this.filters.alpha.opacity=100”
    CSS Lists
    list-style-image: url, none, Compiled: Angad Singh
    list-style-position: inside, outside, Use it, Forward it, Edit it

    You might also like