Görsel Tasarım

Css ile İnce Ayrıntılar

Evet arkadaşlar bu dersimizde css de kullanacağınız ince ayrıntılardan bahsedeceğiz daha doğrusu css kodlarken işinize yaracak ince ayrıntıları oluşturabileceğiniz kodları inceleyeceğiz. Daha önceki css dersimizde en çok kullanılan css kodlarından bahsetmiştik. Bu dersimizde bir tık daha öteye giderek biraz daha profesyonel tasarımlarınızda kullanabileceğiniz css kodlarını inceleyeceğiz. Örneğin bir butonun kenarları nasıl oval yapılır veya nasıl küçük yazılan bir yazı css ile tamamı büyük veya sadece baş harfi büyük yapılır bu tarz ince ayrıntılara değineceğiz. Kodları anlatmak yerine kodu direk yazıp karşısına açıklamalarını ve nasıl kullanılması gerektiklerini yazacağım böylece sıkıcı bir anlatım yerine direk kodları kullanarak önizlemelerini kolayca görebilirsiniz. Hem kullanarak öğrenmiş olursunuz.

Border-radius: Buton, border, resim ve buna benzer objelerin kenarlarına ovallik vermek için kullanılır. Kullanımı: border-radius: 5px 5px 5px 5px;
Word-spacing : Kelimeler arasında bırakılacak boşluğu ayarlamanızı sağlar. Kullanımı: word-spacing :5px;
Letter-spacing : Harfler arasında bırakılacak boşluğu ayarlamanızı sağlar. Kullanımı: letter-spacing :5px;
Capitalize : Kelimelerin ilk harflerini büyük yazar gerisini küçük yazar. Kullanımı: text-transform:capitalize;
Uppercase : Kelimelerin bütün harflerini büyük yazmanızı sağlar. Kullanımı: text-transform:uppercase;
Lowercase : Kelimelerin bütün harflerini küçük yazmanızı sağlar. Kullanımı: text-transform:lowercase;
Margin Auto: İçeriğin tam ortada olmasını sağlar. Kullanımı: margin: 0 auto;
Text-decoration: Kelimenin altının çizili olup olmayacağını belirtir. Kullanımı: text-decoration:none; altı çizili olmasın text-decoration:underline; altı çizili olsun anlamına gelir.

şimdilik bunlar işinizi görücektir arkadaşlar bi başka css dersimizde görüşmek üzere.

Düşüncelerinizi Paylaşın