Css'de Code Tagını Biçimlendirme - SPAKSU™ Blog [fdx-switch-link]

Css’de Code Tagını Biçimlendirme

Sitenize yada blogunuza kullanımı göstermek amacıyla kaynak kodu eklerken epey zorluk çekersiniz. CSS ile hazırladığım basit ve ufak bir kodlama sayesinde istediğiniz biçimde ve renklerde sitenizde kodları gösterebilirsiniz. Verdiğim yapıyı css dosyanıza eklediğiniz taktirde <code>…</code> arasında kullanmanız yeterlidir. Size yazının devamında bir kaç renkte kodlama yapısı sunacağım. Yapıları gördüğünüz çerceveyide demo olarak kabul edebilirsiniz ve verdiğim kodları kendinize göre düzenleyip kendi biçiminizi oluşturabilirsiniz.

Sitemde gördüğünüz renkte;

code
{font:1em 'Courier New',Courier,Fixed;
display:block;
overflow:auto;
text-align:left;
background:#f8f8f8;
color:#111;
border:1px solid #ccc;
border-left:6px solid #ccc;padding:4px;}

Sitemde gördüğünüz biçimin mavisi;

code
{font:1em 'Courier New',Courier,Fixed;
display:block;
overflow:auto;
text-align:left;
background:#EAF3FA;
color:#222;
border:1px solid #83B4D5;
border-left:6px solid #83B4D5;padding:4px;}

Sitemde gördüğünüz biçimin kırmızısı;

code
{font:1em 'Courier New',Courier,Fixed;
display:block;
overflow:auto;
text-align:left;
background:#FFE3DD;
color:#111;
border:1px solid #FF3300;
border-left:6px solid #FF3300;padding:4px;}

2 yorumlar On Css’de Code Tagını Biçimlendirme

Bi Yanıt Bırak:

E-posta hesabınız yayınlanmayacak.

© 2006-2018 Tüm hakları Spaksu Blog'a aittir.

Kullanım Şartları yerine getirilmeden hiçbir şekilde kopyala - yapıştır yapılamaz, yazılar ve bilgiler kullanılamaz.