Css etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
Css etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

13 Eylül 2014 Cumartesi

Cssde kodlar3

Kolonlama :

column-count:2;      kactane kolon olacagını gösterir
 column-width:200px    kolonun genişliğini gösterir
column-gap:100px  ikik kolon arası uzaklık
-web-kit-column-rule:10px solid red;  kolonlar arası cizgi cizer

Jquery de gizle göster butonu :

hide gizler     show gösterir    toggle hem gizler hem gösterir


örnegin;




function goster(){
    $("#kutu").show(100);
    }


////göster butonu olusturur ///////








Fonksiyon yap:

h1 kırmızı yap
 



ile bi link olusur tıklayınca


function h1sec(){
        $("h1").css("color","purple");
       
    }




yazımızın rengi kırmızı olur











Share:

16 Ağustos 2014 Cumartesi

Css de Kodlar2

margin      divin dısından bosluk bırakmayı

padding ise   divin icinde bosluk bırakmayı saglar     4 yönüde aynı anda verebilirz üstten basalnır saat yönünde gider        padding   20px 30px 100px 1120 px     yukarıdan 20 sagdan 30px bosluk bırakr

             aynı sekilde margin dede aynı anda verebilir 4 yönü

yazıyı saglı sollu hizalama yapar     text-align:justify;

kelimeler arasına bosluk bıraktırmak istersek   word-spacing:15px ;  eger  -2px dersek bosluk azaltır
harfler arası bosluk bıraktırmak istersek      letter-spacing:2px dersek 2pxlik araları uzatır - dersek azalır

taşan kelimeyi alta almak icin        word-wrap:break-word;     

yazıya gölgelem yapar   text-shadow:15px 15px 15px grey;       degerler sırayla   soldansaga,yukarıdan asagı ,blur ve  renktir
Share:

13 Ağustos 2014 Çarşamba

Css de Kodlar

background-attachment: fixed      ..........arka plan resmi hareket etmez sabit kalır

body{ background  : url(http:). ............... arka plana resim koyar

opacity :0.5                   ..........0 ile 1 arasında deger alır seffaflık katar ..

text-align                      .............yazıyı saga sola ortaya yaslamaya yarar   sadece yazıyı ...


www.süleyman.com       ...............link vermeye yarar ..



altı cizili olmasın dersek css de   a{text-decoration:none }  deriz altında cizgi gider


altı cizili istersek        text-decortion:underline
üst cizili istersek       text-decoration:overline 
tam oratadan cizgi istersek    text-decoration:line-through


yazı büyüklü kücüklü ise biz hepsini aynı yapmak istiyorsak    text-transform:uppercase  dersek hepsi büyük olur

yazı büyüklü kücüklü ise biz hepsini aynı yapmak istiyorsak    text-transform:lowercase  dersek hepsi
kücük olur

paragrafın basında bosluk bıraktırıp baslatmak istiyorsak text-indent:60px  deriz 60px bosluk bırakır



border ile kenarlık yapılır        border:12px solid red         12px genisliginde  kırmızı kenarlık
                                                border-left:50px solid yellow      50 genislikte sol sarı


kenarlık sekli olarak    dotted dersek noktalı       dashed dersek cizgi cizgi olur kenarlık
double dersekte cift cizgi olur


listeleme yaparken basındaki ifade sekil yok  olsun derse list-style-type:none deriz
                                               eger daire olsun istersek    list-style-type:circle deriz
                                               eger kare olsun ister     list-style-type:square deriz
                                               eger roma rakıamı olsun istersek list-style-type:upper-roma deriz
                                               eger harfler olsun istersek    list-style-type:lower-alpha deriz
             eger ikonu biz ekleyeceksek 
                 list-style-image: url("http://www.akademisacterapi.com/images/liste_ikon_b.png")


eger siteye resim yüklüceksek

    diyip   yukarda class olustrup genislik yükseklik ayarlarız












ACILIR REKLAM YAPMA 

#reklam{background-image: url(logo.png);  //İLK RESİM
            display:inline-block;
            -webkit-transition: all 1s;      //
İKİNCİ RESİM KAC SANİYE SONTA
            height:50px;
            width:900px;
            background-color:grey
            }
    #reklam:hover{
            margin-top:60px;
            background-image: url(dernek.png);
     //İKİNCİ RESİM
            display:inline-block;
            height:500px;
            width:900px;
           
            }




















Share: