GNU Free Documentation License . .

( «CSS»)
: ,

CSS.svg

.css

MIME

text/css

17 1996

()

Level 1 (Recommendation)
Level 2 (Recommendation)
Level 2 Revision 1 (Recommendation)

     HTML

CSS (. Cascading Style Sheets  , .

, -, HTML XHTML, XML-, , SVG XUL.

[]

[] CSS

CSS - , , -. CSS - ( HTML ) - ( CSS). , , . , CSS , , , ( ), , .

[] CSS

CSS CSS , CSS. -, , , CSS. ( , CSS . .css , CSS .)
, , - :

  • , - <link>, <head> </head>. ( <link> href, ). ;
<head>
.....
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
  • , - @import, <style> </style> (, , <head> </head>) <style>, ( , url) . ;
<head>
.....
  <style type="text/css" media="all">
    @import url(style.css);
  </style>
</head>
  • , <style> </style> (, , <head> </head>). ;
<head>
.....
  <style type="text/css">
    body { 
      color: red;
    }
  </style>
</head>
  • , - ( style) . .
  <p style="font-size: 21px; color: green;">  ,    </p>

, , .

CSS XML-, . :

  <?xml-stylesheet type="text/css" href="style.css"?>

[]

, HTML- , . HTML , , -, -, .

, , . , - .
, , p, b. b p, body. , p body . , p , body.

CSS , , , , , (. « »).

[] CSS

CSS (. ) CSS . , , , . . , , , , «;». CSS , «:». . .

,  {
  : ;
  : ;
  : ;
}

CSS (. ) CSS ( style , ) CSS : »), «;».

[]

CSS

  • ;
p {font-family: Garamond, serif;}
  • ;
.note {color: red; background: yellow; font-weight: bold;}
  • ;
#paragraph1 {margin: 0;}
  • ;
 a[href="http://www.somesite.com"]{font-weight:bold;}
  • ( );
div#paragraph1 p.note {color: red;}
  • ;
p.note > b {color: green;}
  • ;
h1 + p {font-size: 24pt;}
  • ;
a:active {color:yellow;}
  • .
p::first-letter {font-size: 32px;}
  • CSS , , . , * {color:red;}. , , , , , .first {...} *.first {...} .

[] . .

- () HTML class id ():

<div id="first"> ... </div>
<p class="big"> ... </p>

, - , - . , ( , ). .

: JavaScript .

, , .

. ( «.»), ( «#»), - .

CSS , , , , , , , . CSS : , , .

[] . . CSS.

CSS HTML . , CSS, -, . , , CSS , p CSS , , p, p CSS (, color:green;), -, .

, - HTML CSS, , . .

  • ;
  • ,   ;
  • , . , :
    • , ;
    • , , ;
    • , (. « »), style . , - , , . . :
      • (#id)   - ((1,0,0) CSS);
      • (.class) (:pseudoclass)   - ((0,1,0) CSS );
      • - ((0,0,1) CSS). ( , , , (1,0,0) , ́ , (0,10,0), (0,1,0) , , (0,0,10). , , , .)
    • , style ;
    • , , !important. , , , ( ) , , .

[]

( .css, <style> «» -, ):

p {
  font-family: Garamond, serif;
}
h2 {
  font-size: 110 %;
  color: red;
  background: white;
}
.note {
  color: red;
  background: yellow;
  font-weight: bold;
}
p#paragraph1 {
  margin: 0;
}
a:hover {
  text-decoration: none;
}
#news p {
  color: blue;
}

CSS p, h2, .note, p#paragraph1, a:hover #news p.

  1. HTML- p () . Garamond, , , - («serif»).
  2. HTML- h2 ( ). .
  3. , class 'note'. , : <p class="note"> .</p>
  4. p, id paragraph1. (margin).
  5. hover a . , a . , .
  6. , , p, - id, «news» (#news p , . 5- ).

[] CSS-

CSS - HTML, . CSS . , .

:

  • . , , , .
  • CSS-. , , .
  • . , CSS-.
  • . , CSS- , ( ) , .

:

  • ( ), CSS.
  • CSS-, HTML, CSS, .

[] CSS

CSS  , W3C « Web»[1]. 1990- Web, - , - . HTML 4.01 XHTML CSS.

1990- . HTML , CSS .

« » 1994 . CSS.

, CSS , , .

1990- (W3C) CSS, 1996 CSS1.

[] 1 (CSS1)

W3C, 17 1996 , 11 1999 [2]. , :

  • . ,   , .
  • . , , .
  • . , ( )
  • , , .
  • , , , (padding) (margin) . , float clear.

[] 2 (CSS2)

W3C, 12 1998 [3]. CSS1 . :

  • . , . .
  • . ( , , ).
  • . ,  . . ( ).
  • . , , .
  • .
  • .
  • . , , .

W3C CSS2 CSS2.1

[] 2, 1 (CSS2.1)

W3C, 7 2011 .

CSS2.1 CSS2. , , . CSS3.

[] 3 (CSS3)

[4].

. , , , () , , [5][6].

[] 4 (CSS4)

W3C 29 2011 .[7][8]

[] CSS

CSS , Gecko (Mozilla Firefox .), WebKit (Safari, Arora, Google Chrome) Presto (Opera)[9].

- [10] Internet Explorer 6 CSS [11].

7 Internet Explorer 7 CSS[12][13], [14].

Internet Explorer 8 , CSS 2.1   CSS 3[15].

- ( CSS) Acid. Acid2, , , Acid3.

[]

CSS W3C , width , . Internet Explorer (4 5), , width , (padding) (border). Internet Explorer 5 Netscape 4 Opera 7. W3C IE .

CSS3 box-sizing, content-box W3C border-box IE 5.

Mozilla, , «» -moz-box-sizing,   padding-box, , width , .

[] CSS-

CSS - , . CSS- ( CSS-) ( ) . , , Internet Explorer 6 , * html (, «star html bug»). , , W3C IE, Quirks mode , #someblock 100 10 :

/*  W3C - 80px    10px     */
#someblock { width: 80px; padding: 10px; }
/*     IE6. */
* html #someblock { width: 100px; padding: 10px; }

Internet Explorer .

[]

Internet Explorer, 2010 : (CSS) , [16].

[] CSS Framework

CSS Framework ( Web design framework) css-, , ( . .). , CSS-, .css-, «» ( -), xhtml-.

[] CSS

: , . , . CSS , .

CSS. , CSS , . " CSS" CSS-, , . :

  • ( JavaScript)

CSS:

[] .

[]

[]

[]

[]

[]