Scribd Logo
Încărcați

Bine ați venit la Scribd!

  • Stiluri Pentru Fonturi

    Încărcat de

    andy_007_io
    14 vizualizări3 pagini

    Titlu original

    [3] Stiluri pentru fonturi

    Drepturi de autor

    © Attribution Non-Commercial (BY-NC)

    Formate disponibile

    TXT, PDF, TXT sau citiți online pe Scribd

    Vi se pare util acest document?

    Este necorespunzător acest conținut?

    Raportați acest document

    Drepturi de autor:

    Attribution Non-Commercial (BY-NC)
    Descărcați ca TXT, PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    14 vizualizări3 pagini

    Stiluri Pentru Fonturi

    Încărcat de

    andy_007_io

    Drepturi de autor:

    Attribution Non-Commercial (BY-NC)
    Descărcați ca TXT, PDF, TXT sau citiți online pe Scribd
    Indicator pentru conținut neadecvat
    din 3

    Aceste elemente specifica argumentul fontului care se asociaza unui element HTML

    fiind incluse ori in zona HEAD ori in interiorul etichetei dorite.


    In cazul de fata se remarca asemanarea cu eticheta font din HTML care accepta ar
    gumentele type, style, size si weight.
    3.1 font-family
    font-family este de fapt o lista de fonturi din care browserul va folosi in ordi
    nea in care le recunoaste (primul folosit va fi primul din lista, daca nu este r
    ecunoscut il foloseste pe al doilea si tot asa mai departe). Este recomandat ca
    ultima pozitie din lista sa fie un font generic (de exemplu serif, sans-serif sa
    u monospace).
    In situatia in care numele fontului este format din doua cuvinte se incadreaza i
    ntre ghilimele duble pentru ca browserul sa le interpreteze impreuna.
    CSS/exemplu3_1.html">Exemplu: CSS introdus in HEAD aplicat etichetei p. Browseru
    l nu recunoaste primele doua fonturi din lista, folosindu-l pe al treilea

    <html>
    <head>
    <title>Exemplu 3_1</title>
    <style type="text/css">
    <!-- p{font-family: font1,font2,arial;}-->
    </style>
    </head>
    <body>
    <p>Text scris cu cu fontul Arial</p>
    Text negru
    <p>Text scris cu cu fontul Arial</p>
    </body>
    </html>
    Exemplu: acelasi exemplu dar CSS introdus in eticheta p din HTML

    <html>
    <head>
    <title>Exemplu 3_2</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>
    3.2 font-size
    Este parametrul prin care stabilim dimesiunea fontului, exprimat in pixeli (px),
    puncte (pt), keywords sau procente. Are o functionare asemanatoare cu eticheta
    <font>.
    Exemplu: CSS introdus in HEAD aplicat etichetei p, dimensiunea exprimata in pixe
    li

    <html>
    <head>
    <title>Exemplu 3_3</title>
    <style type="text/css">
    <!-- p{font-size: 20px;}-->
    </style>
    </head>
    <body>
    <p>Text scris cu font de 20px</p>
    Text negru
    </body>
    </html>
    Pentru dimensiunea exprimata in puncte folosim acelasi exemplu inlocuid px cu pt
    .
    Dimensiunea exprimata prin keywords foloseste cuvinte in loc de cifre. Sapte cuv
    inte inlocuiesc dimensiunile de la 1 la 7 de la veche eticheta FONT FACE din HTM
    L.

    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 in care se inlocuieste 20px
    cu unul din cuvintele de mai sus.
    Procentele sunt o alta valoare pe care o poate lua font-size. Aceasta modalitate
    poate fi vizualizata diferit de browsere diferite.
    Ca verificare folositi acelasi exemplu schimband 20px cu 200%.
    3.3 font-style
    font-style este folosit pentru a adauga caracteristica italica fontului. Poate l
    ua valorile normal si italic.

    <style type="text/css">
    <!-- p{font-style: italic;}-->
    </style>
    3.4 font-weight
    font-weight este paramerul care stabileste grosimea caracterului putand lua valo
    rile numerice de la 100 la 900 sau BOLD, BOLDER, LIGHTER.

    <style type="text/css">
    <!-- p{font-weight: 700;}-->
    </style>
    3.4 Compunerea stilurilor
    Stilurile prezentate anterior pot fi folosite simultan in interiorul aceeasi eti
    chete fiind despartite de caracterul ; (punct si virgula).
    Exemplu: folosirea unui stil compus aplicat etichetei p

    <html>
    <head>
    <title>Exemplu 3_4</title>
    <style type="text/css">
    <!--
    p{
    font-family: arial;
    font-size: 20px;
    font-style: italic;
    font-weight: 800;}
    -->
    </style>
    </head>
    <body>
    <p>Text scris cu Arial, 20px, italic, 800</p>
    Text negru
    </body>
    </html>

    S-ar putea să vă placă și