Curs 8 - Conținut și design în programarea web - Andrei

Curs 8 - Conținut și design în programarea web - Andrei Curs 8 - Conținut și design în programarea web - Andrei

andrei.clubcisco.ro
from andrei.clubcisco.ro More from this publisher
29.06.2013 Views

Universitatea Politehnica Bucuresti - Facultatea de Automatica si Calculatoare Exemplu de CSS • /* This is a comment */ • h1,h2,h3 {font-family: Arial, sans-serif;} /* use 1st available font */ • p, table, li, address { /* apply to all these tags */ font-family: "Courier New"; /* quote values containing spaces */ margin-left: 15pt; /* specify indentation */ } • p, li, th, td {font-size: 80%;} /* 80% of size in containing element */ • th {background-color:#FAEBD7} /* colors can be specified in hex */ • body { background-color: #ffffff;} • h1,h2,h3,hr {color:saddlebrown;} /* adds to what we said before */ • a:link {color:darkred} /* an unvisited link */ • a:visited {color:darkred} /* a link that has been visited */ • a:active {color:red} /* a link now being visited */ • a:hover {color:red} /* when the mouse hovers over it */ 07.05.2009 Curs Programare Web, anul 4 C5 – Curs 8 46

Universitatea Politehnica Bucuresti - Facultatea de Automatica si Calculatoare Selectori • Un tag XML sau HTML poate fi folosit ca un simplu element selector: body { background-color: #ffffff } • Putem insa folosi selectori multipli: em, i {color: red} Putem repeta selectorii: h1, h2, h3 {font-family: Verdana; color: red} h1, h3 {font-weight: bold; color: pink} • Atunci cand valorile nu coincid, ultima declaratie suprascrie declaratiile anterioare • Selectorul universal * se aplica oricarui si tuturor elementelor: * {color: blue} • Atunci cand valorile nu coincid, selectorii mai specifici suprascriu comportamentul selectorilor mai generali (deci elementele em vor fi in continuare rosii) 07.05.2009 Curs Programare Web, anul 4 C5 – Curs 8 47

Universitatea Politehnica Bucuresti - Facultatea de Automatica si Calculatoare<br />

Exemplu de CSS<br />

• /* This is a comment */<br />

• h1,h2,h3 {font-family: Arial, sans-serif;} /* use 1st available font */<br />

• p, table, li, address { /* apply to all these tags */<br />

font-family: "Courier New"; /* quote values containing spaces */<br />

margin-left: 15pt; /* specify indentation */<br />

}<br />

• p, li, th, td {font-size: 80%;} /* 80% of size in containing element<br />

*/<br />

• th {background-color:#FAEBD7} /* colors can be specified in hex */<br />

• body { background-color: #ffffff;}<br />

• h1,h2,h3,hr {color:saddlebrown;} /* adds to what we said before */<br />

• a:link {color:darkred} /* an unvisited link */<br />

• a:visited {color:darkred} /* a link that has been visited */<br />

• a:active {color:red} /* a link now being visited */<br />

• a:hover {color:red} /* when the mouse hovers over it */<br />

07.05.2009 <strong>Curs</strong> Programare Web, anul 4 C5 – <strong>Curs</strong> 8<br />

46

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!