Mutlaka bilmeniz gereken 5 CSS kodu

Bu yazımda css üzerinden yazılan kodların genelde hangi kısımlarda ve bazı kodların daha kısa kodlanabilir hallerini anlatmaya çalıştım Yazılıma ilk başlayan arkadaşların genelde yaptığı yanlışları şu şekilde derledim 1 – Sayfa ortalama Bazı çalışmalarımızda sayfayı ortalamak ciddi zaman kayıplarına yol açabiliyor yani zor olabiliyor. Bu olayı kolay yoldan çözmek için: DOĞRU                                                                      YANLIŞ 2 – REM […]

Bu yazımda css üzerinden yazılan kodların genelde hangi kısımlarda ve bazı kodların daha kısa kodlanabilir hallerini anlatmaya çalıştım

Yazılıma ilk başlayan arkadaşların genelde yaptığı yanlışları şu şekilde derledim

1 – Sayfa ortalama

Bazı çalışmalarımızda sayfayı ortalamak ciddi zaman kayıplarına yol açabiliyor yani zor olabiliyor. Bu olayı kolay yoldan çözmek için:

DOĞRU                                                                     

image

YANLIŞ

image 1

2 – REM ve EM kullanımı

Web sitesi ile ilgilenen frontend ve grafiklerin daima bilmesi gereken ve kullanırken dikkat etmesi gereken ölçü birimleridir.

em değeri elemana tanımlanan yazı tipini baz alırken rem değeri her zaman kök(root) elementinin yazı tipini baz alır.

px yerine rem ve em kullanımı Responsivity açısından önemlidir .

1rem = 16px

DOĞRU                                                                     

image 2

YANLIŞ

image 3

3 – Margin ve Padding

Margin ve padding taglarını tek satır halinde de yazabilmek mevcuttur tabi yine de tercih meseleside olsa bu şekilde daha kullanışlı olduğunu söyleyebilirm.

DOĞRU                                                                     

image 4

YANLIŞ

image 5

4 – Background kısaltması

Background taglarini tek satır halinde de yazabiliriz ve bu işlem hem hoş duruyor hem de kullanışlıdır.

image 6

5 – Front kısaltması

Background’da olduğu gibi front işlemleride de tek satır kullanabileceğimiz kod satırları bulunmaktadır.

DOĞRU

image 7

YANLIŞ

image 8

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir