Stiluri pentru fronturi

Subiect: Stiluri pentru fronturi Lun Iul 06, 2009 3:51 pm

Aceste elemente specifică argumentul fontului care se asociază unui element HTML fiind incluse ori în zona HEAD ori în interiorul etichetei dorite.
În cazul de faţă se remarcă asemănarea cu eticheta font din HTML care acceptă argumentele type, style, size şi weight.

font-family
font-family este de fapt o listă de fonturi din care browserul va folosi în ordinea în care le recunoaşte (primul folosit va fi primul din listă, dacă nu este recunoscut îl foloseşte pe al doilea şi tot aşa mai departe). Este recomandat ca ultima poziţie din listă să fie un font generic (de exemplu serif, sans-serif sau monospace).
În situaţia în care numele fontului este format din două cuvinte, se încadrează între ghilimele duble pentru ca browserul să le interpreteze împreună.

Exemplu: CSS introdus în HEAD aplicat etichetei p. Browserul nu recunoaşte primele două fonturi din listă, folosindu-l pe al treilea:

Cod:: <html>
<head>
<title>Exemplu</title>
<style type="text/css">

</style>
</head>
<body>
<p>Text scris cu cu fontul Arial</p>
Text negru
<p>Text scris cu cu fontul Arial</p>
</body>
</html>

Exemplu: acelaşi exemplu dar CSS introdus în eticheta p din HTML:

Cod:: <html>
<head>
<title>Exemplu</title>
</head>
<body>
<p style="font-family: font1,font2,arial;">Text scris cu cu fontul Arial</p>
Text negru
<p style="font-family: font1,font2,arial;">Text scris cu cu fontul Arial</p>
</body>
</html>

font-size
Este parametrul prin care stabilim dimesiunea fontului, exprimat în pixeli (px), puncte (pt), keywords sau procente. Are o funcţionare asemănătoare cu eticheta <font>.

Exemplu: CSS introdus în HEAD aplicat etichetei p, dimensiunea exprimată în pixeli:

Cod:: <html>
<head>
<title>Exemplu</title>
<style type="text/css">

</style>
</head>
<body>
<p>Text scris cu font de 20px</p>
Text negru
</body>
</html>

Pentru dimensiunea exprimată în puncte folosim acelaşi exemplu înlocuind px cu pt.

Dimensiunea exprimată prin keywords foloseşte cuvinte în loc de cifre. Şapte cuvinte înlocuiesc dimensiunile de la 1 la 7 de la vechea etichetă FONT FACE din HTML.
CSS keyword numar FONT size
xx-small 1
x-small 2
small 3
medium 4
large 5
x-large 6
xx-large 7

Pentru verificare se poate folosi exemplul anterior în care se înlocuieşte 20px cu unul din cuvintele de mai sus.

Procentele sunt o altă valoare pe care o poate lua font-size. Această modalitate poate fi vizualizată diferit de browsere diferite.
Ca verificare folositi acelasi exemplu schimbând 20px cu 200%.

font-style
font-style este folosit pentru a adăuga caracteristica italică fontului. Poate lua valorile normal şi italic.

Cod:: <style type="text/css">

</style>

Compunerea stilurilor
Stilurile prezentate anterior pot fi folosite simultan în interiorul aceeaşi etichete fiind despărţite de caracterul ; (punct şi virgulă).

Exemplu: folosirea unui stil compus aplicat etichetei p

Cod:: <html>
<head>
<title>Exemplu 3_4</title>
<style type="text/css">

</style>
</head>
<body>
<p>Text scris cu Arial, 20px, italic, 800</p>
Text negru
</body>
</html>

Sursa : Aici

Subiect: Re: Stiluri pentru fronturi Lun Iul 06, 2009 4:27 pm

Subiect: Re: Stiluri pentru fronturi Lun Iul 06, 2009 4:35 pm

GG

Io nus cu HTML:D

Admin Numarul mesajelor : 92 Data de inscriere : 05/07/2009

siK a scris:: gj

Subiect: Re: Stiluri pentru fronturi Joi Iul 09, 2009 2:04 pm

Multumesc aLLz Kiss

!