0
Kayıt Ol

Css Arkaplan Özellikleri

9

●

10.642

  • 02-09-2007, 18:07:47
    #1
    saho
    saho
    Üyeliği durduruldu
    Css nin bg özellikleri sade ve yalın bir dille anlatılmış eminim işinize yarayacaktır

    CSS özellikleri bir elementin arkaplanını belirlemenize imkan sağlar. Arkaplanlar renkler ya da resimler olabilir.

    Arkaplan özellikleri şunlardır:
    1. back-ground,
    2. background-color,
    3. background-image,
    4. background-repeat,
    5. back-ground-attachment,
    6. background-position.

    Şimdi bunları tek tek açıklayalım:


    1. background

    Değer: background-color, background-image, back ground-repeat, background-attachment, back-ground-position, inherit

    Nelere uygulanır: Bütün unsurlara.

    background özelliği kişisel arkaplan özelliklerini ayarlamak için pratik bir yoldur.

    Örnek:

    BODY { background: red }

    P { background: url("bg.png") #cecece 50% repeat fixed }



    2. background-color

    Değer: color, transparent, inherit
    Nelere uygulanır: Bütün unsurlara.

    Örnek:

    table { background-color: #cecece }



    3. background-image

    Değer: url, none, inherit
    Nelere uygulanır: Bütün unsurlara.

    Bir arkaplan resmi ayarladığınız zaman eğer resim mevcut değilse bir renk belirtmeniz gerekir.

    Örnek:

    .title { background-image: url("images/title.gif") }

    div { background-image: none }



    4. background-repeat

    Değer: repeat, repeat-x, repeat-y, no-repeat, inherit
    Nelere uygulanır: Bütün unsurlara.

    Bu özellik arkaplan resminin x veya y pozisyonunda tekrarı istendiği zaman kullanılır.

    Örnek:

    .content {

    background: white url("bg.gif");

    background-repeat: repeat-x;

    background-position: center;

    }



    5. background-attachment

    Değer: scroll, fixed, inherit
    Nelere uygulanır: Bütün unsurlara.

    Örnek:

    .content {

    background: white url("bg.gif");

    background-repeat: repeat-x;

    background-attachment: fixed;

    }




    6. background-position

    Değer: percentage, length, top center bottom left center right, inherit
    Nelere uygulanır: block-level ve değiştirilen unsurlar.

    Örnek:

    BODY { background: url("logo.jpeg") right top } /* 100% 0% */



    Yazar: Siraceddin El
    alıntı: Web Tasarım, Photoshop, Flash, Programlama, Bilgisayar
    daha detaylı bilgi için : css background - Google Search
  • 17-09-2007, 17:19:29
    #2
    fth
    fth
    Güzel makale, eklediğin için teşekkürler.
  • 10-11-2007, 19:30:58
    #3
    GoLGe
    GoLGe
    Üyeliği durduruldu
    Paylastigin icin tesekkurler.
  • 10-11-2007, 19:42:10
    #4
    Jason
    Jason
    Kimlik doğrulama veya yönetimden onay bekliyor.
    eyvallah saho google'da aradım gene buraya geldim
  • 12-11-2007, 22:32:13
    #5
    saho
    saho
    Üyeliği durduruldu
    bilinen şeyler ama hazırı varken yazmaya gerek yok tu
    kolay gelsin.
  • 20-11-2007, 16:48:16
    #6
    kenantr
    kenantr
    Bir sorum olacak
    body {
background-image:url(/images/bg.gif);
background-position:center;/* arka plan grafigini ortada goster */
background-repeat:repeat-x y;/*arka plan grafigini y ve x ekseninde tekrarla  */
background-color:#000000;/* arka plan rengi siyah olsun  */
font-family:Arial, Helvetica, sans-serif; /* tekst ailesi arial,helvetica */
color:#ffffff;/* yazi rengimiz beyaz */
margin:0px;/* sagdan soldan ustten alttan bir kayma yapilmayacak */
height:100%;
font-size:0.7em;/* yazi buyuklugu */
}
    Şeklinde bir css kullnıyorum ama istiyorumki arkaplan resminin üzerinde bir arka plan resmi daha kullanayım ve bu ikinci arkaplan resmi bg.gif in üstünde yer alsın sayfayı ortalasın aşşağı doğru kendini tekrarlasın.Bunu nasıl yaparım.
  • 20-11-2007, 17:31:07
    #7
    Fibonacci
    Fibonacci
    kenantr adlı üyeden alıntı: mesajı görüntüle
    Bir sorum olacak
    body {
background-image:url(/images/bg.gif);
background-position:center;
background-repeat:repeat-x y;
background-color:#000000;
font-family:Arial, Helvetica, sans-serif; 
color:#ffffff;
margin:0px;
height:100%;
font-size:0.7em;
}
    Şeklinde bir css kullnıyorum ama istiyorumki arkaplan resminin üzerinde bir arka plan resmi daha kullanayım ve bu ikinci arkaplan resmi bg.gif in üstünde yer alsın sayfayı ortalasın aşşağı doğru kendini tekrarlasın.Bunu nasıl yaparım. 
    #arka {
background: url(resme/giden/yol.jpeg) #arkaplan rengi(yoksa "transparent") repeat-y top center;}
    akabinde;
    <body>
<div id="arka">
bla bla bla...
</div>
</body>
  • 20-11-2007, 19:12:33
    #8
    kenantr
    kenantr
    Teşekkür ediyorum hallettim işimi.
  • 21-11-2007, 10:33:01
    #9
    Virtuozzo
    Virtuozzo
    background özelliklerinde background-image, background-color, background-repeat, background-position parametrelerini tek özellikte 
    background: #000000 url('images/bg.gif') no-repeat top;
    şeklinde kullanabilirsiniz. ( Renk - resim adresi - yenileme - hizalama )


    Font için de parametreleri aşağıdaki gibi birleştirebilirsiniz.
    font: normal 0.7em Arial, Helvetica, sans-serif;
    font: bold 12px Arial, Helvetica, sans-serif;