Neler yeni

Foruma hoş geldin 👋, Ziyaretçi

Forum içeriğine ve tüm hizmetlerimize erişim sağlamak için foruma kayıt olmalı ya da giriş yapmalısınız. Foruma üye olmak tamamen ücretsizdir.

  • Forumdan daha fazla yararlanmak için, profilinizi telefon numaranız 📱 ile doğrulayın ve daha ayrıcalıklı olun 😉
    Daha fazla bilgi!

Teşekkür Mesajı

aleov

xFanatik
Kullanıcı
Katılım
24 Eki 2018
Mesajlar
224
Bu sitede öğrendiklerime karşılık küçük bir teşekkür videosu hazırlamak istedim.

Sorularıma cevap veren herkese teşekkür ediyorum.

Video konusu: Önek Ekleme

To view this content we will need your consent to set third party cookies.
For more detailed information, see our cookies page.

Kullanılan kod;

Kod:
<xf:comment> ONEK CSS Tanimi </xf:comment>
.onek_yarisma {
    color: rgba(255,255,255,0.8);
    border-radius: 3px;
    display: inline-block;
    position: relative;
    font-size: 90%;
    padding: 0 5px 0 32px;
    cursor: pointer;
    font-size: 80%;
    font-weight: normal;
    &:before {
        background-color: rgba(0, 0, 0, 0.2);
        position: absolute;
        border-top-right-radius: 30px;
        border-right: 4px solid rgba(0, 0, 0, 0.1);
        top: 0;
        bottom: 0;
        left: 0;
        padding: 2px 2px 2px 2px;
        width: 20px;
        .m-faBase();
    }
}


<xf:comment>  ONEK CSS Tanimi </xf:comment>
.yarisma {
    background-color: #8b1a1a;
}
.yarisma:before {
    content: "\f024";
}

Önek ikonları; Font Awesome 5 Cheatsheet

Bazı ikonlar çalışmıyor böyle bir sorunla karşılaşırsanız @İLTERİŞ HAN 'ın da dediği gibi


.m-faBase();
font-family: 'Font Awesome 5 Brands';

şeklinde düzenleyebilirsiniz.

İyi forumlar
 
Bu arada koda paneldeki önekler gibi border eklemeye çalıştım ama olmadı nerede hata yapıyor olabilirim?
Bu şekilde ekledim devamına

Kod:
<xf:comment>  ONEK CSS Tanimi </xf:comment>
.yarisma {
    background-color: #2577B1;
}
.yarisma:before {
    content: "\f024";
}

İstediğim çerçeve;

5699
 
Herhangi bir elemana kenar çizgi (cerceve) vermek için:
border:1px solid #000;
gibi... buradaki 1px ile kenar kalınlığı ve renk seçeneğini ihtiyaca göre düzenlersin.
Sadece bir kenara cizgi vermek için, örneğin sag kenar: border-right:1px solid gray;
Özellikle renk ismi gray yazdım, farklı örnek olsun... bazı renklerde direkt renk ismide kullanılabilir. (her renk ismi için geçerli değil!)
Hazır CSS border konusu yazmızken, ek bilgi olarak kenar ögelerinde farklı çizgiler kullanımı var: solid, dashed, dotted gibi...
 

Foruma hoş geldin 👋, Ziyaretçi

Forum içeriğine ve tüm hizmetlerimize erişim sağlamak için foruma kayıt olmalı ya da giriş yapmalısınız. Foruma üye olmak tamamen ücretsizdir.