29 octombrie 2008

Despre CSS, sau cat de varza sunt la asta

Am dat recent pe un post de blog de un nene (Stefano Mazzocchi mai precis) care-mi zicea (nu personal) ca sunt varza la CSS. Nimic mai adevarat ! De aceea m-a invatat urmatoarele :

1. intotdeauna sa pun : <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> si <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

2. Ca sa fac designu unui site sa folosesc Builderu' de Yahoo

3. Ca sa testez diferite tipur de scris (fonturi) sa folosesc TypeTesteru'

4. Sa folosesc palete de culori, ca se gasesc la Iubitorii de culori, sau chiar la Adobe Kuler. Pot genera palete de culori dintr-o poza (sic) la BigHugeLabs sau la DeGraEve.

5. In CSS exista urmatoarele :

  • h1 + h2 { margin-top: -1em; } - adica daca am h1 urmat de h2, se aplica CSS-u ala pentru h2
  • h1 > h2{ margin-top: -1em; } - adica daca am h2 intr-un h1, se aplica CSS-u ala pentru h2
  • q { font-family: "Georgia", serif; }
    q:before { content: "\201C"; padding-right: 0.1em; }
    q:after { content: "\201D"; padding-left: 0.1em; }
    se numesc Curly Quotes si cica sunt niste ghilimele mai misto.
  • Breadcrumbs (adica linkurile de genu "sunteti aici: categorie subcategorie produs") el le face cu :
    ul.path > li { content: "\00BB"; font-family: "Times New Roman", serif; font-size: 14px; padding-left: 6px; }
  • Initialele (prima litera din primu paragraf) le face cu :
    p.first:first-letter { font-family: "Imprint MT Shadow", "Times", "Times New Roman", serif; font-size: 3.6em; color: #222; }
  • Si ca poti folosi fisiere CSS pentru browsere diferite
    <!--[if lt IE 7]><script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE7.js" type="text/javascript"></script><![endif]-->
    <!--[if lt IE 8]><script src="http://ie7-js.googlecode.com/svn/version/2.0(beta3)/IE8.js" type="text/javascript"></script><![endif]-->