Editor X: Kılavuzların Kullanımı

7 dakikalık okuma
Editor X platformu, ajanslara ve serbest çalışanlara yönelik yeni platformumuz Wix Studio'ya geçiş yapıyor.Wix Studio hakkında daha fazla bilgi edinin (Yalnızca İngilizce)
CSS kılavuzları, ögelerinizin yapılandırılmış bir şekilde düzenlenmesini sağlamanın harika bir yoludur. Editor X'te her konteyner ve bölüm yerleşik bir kılavuzla birlikte gelir. Kompozisyonunuzun gerektirdiği satır ve sütun sayısını seçebilir ve boyutlarını birçok farklı ölçüme göre ayarlayabilirsiniz. 
Bu makalede, Editor X'te kılavuzlarla çalışma hakkında her şeyi öğrenin:
Daha fazla bilgi edinmek ister misiniz?
Editor X akademisindeki ızgaralar hakkındaki eğitim videomuza göz atın.

Mevcut bir kılavuzu ayarlama

Her bölüm ve konteyner ayarlayabileceğiniz yerleşik 1x1 kılavuzla birlikte gelir. Tek tıklamayla farklı bir düzene geçin veya çizgileri mevcut kompozisyonunuzun üzerine sürükleyerek kendi kılavuzunuzu oluşturun. 

Kılavuzu ayarlamak için:

  1. İlgili konteynere veya sayfa bölümüne tıklayın.
  2. Kılavuzu aşağıdaki yollardan birini kullanarak değiştirin:
İpucu:
Ayrıca, Bölüm Ekle simgesine  tıklayarak yerleşik kılavuzu olan bir bölüm ekleyebilirsiniz.


Izgarayı Denetçi panelinden yönetme

Kılavuzunuzu özelleştirerek tam istediğiniz düzeni elde edin. Satır ve sütun sayılarını değiştirebilir, boyutlarını ve aralıklarını ayarlayabilirsiniz.

Bir kılavuzu yönetmek için:

  1. İlgili kılavuza tıklayın.
  2. Editor X'in en üstündeki Denetçi simgesine  tıklayın.
  3. Düzen sekmesine  tıklayın ve Görüntüleme'ye gidin.
  4. Yapmak istediğiniz işlemi seçin:
    • Farklı bir düzen seçin: Mevcut kılavuzla aynı sayıda hücre içeren farklı bir görünüm seçmek için Düzen açılır menüsüne tıklayın.
    • Kılavuzunuzu manuel düzenleyin: Nasıl yapılacağını öğrenmek için üzerine tıklayın:
Kesme noktalarıyla çalışma:
Bir kılavuz tasarlarken, kılavuzunuz yalnızca üzerinde çalıştığınız belirli kesme noktasında görünür. Ögelerinizin kompozisyonunun kusursuz olmasını sağlamak için her ekran boyutu için ayrı bir ızgara oluşturmalısınız. 

Ögeleri bir kılavuz içerisinde konumlandırma

Ögeleri eklerken ve kılavuzunuza yerleştirirken, duyarlı bir düzen oluşturmanıza yardımcı olacak çeşitli araçlar vardır:

Ögeleri yanaştırma

Ögeleri kılavuz çizgilerine yanaştırma yoluyla tam istediğiniz gibi konumlandırıldıklarından emin olabilirsiniz. Bir kılavuz hücresine bir öge eklediğinizde, otomatik olarak en yakın dikey ve yatay kılavuz çizgilerine yanaştırılır. Yanaştırmayı, Denetçi panelinden gerektiği şekilde ayarlayabilirsiniz. 

Ögeleri farklı bir kılavuz hücresine taşıma

Denetçideki Konum sekmesinin altında, bir ögeyi seçebilir ve içinde bulunduğu kılavuz hücrelerini görebilirsiniz. Ögeyi istediğiniz noktaya sürükle-bırak kullanmadan taşımak için herhangi bir kılavuz hücresine tıklayın. 

Ögeleri bir kılavuz hücresini dolduracak şekilde uzatma

Ögeleri sadece tek bir tıklamayla bir kılavuz hücresini dolduracak şekilde uzatın. Bir öge birden fazla hücrenin kılavuz çizgileri üzerinde konumlandırılırsa, bulunduğu tüm hücrelerin üzerine uzatılır.

Kılavuz birimmleri tablosu

Kılavuzunuzu oluşturmak için tüm CSS birimleri yelpazesini kullanın. Yüzdeler, pikseller veya kesirler kullanarak sütunların ve satırların boyutunu ayarlayabilirsiniz. Ayrıca sütunların ve satırların minimum ve maksimum boyutunu ayarlayabilir ve hatta ihtiyacınız olan kılavuzu oluşturmak için hesaplamaları kullanabilirsiniz. 
Not:
Satır ve sütunlarınızın boyutunu farklı birimlerde ayarlayabilirsiniz. Varsayılan olarak, satır birimleri piksel, sütun birimleri ise kesir cinsindendir. 
Birim
Birim Türü
Açıklama
Kesir (fr)
Değişken
Sütunlarınızın/satırlarınızın boyutunu, sayfa bölümü/konteyner boyutunun bir kesri olacak şekilde ayarlayın. Ör. 2 sütunlu bir ızgarada, sol sütun 2fr'ye ve sağ sütun 1fr'ye ayarlanmışsa, sol sütun bölümün/konteynerin 2/3'ünü kaplayacaktır.
Otomatik
Değişken
Satırların ve sütunların yüksekliği ve genişliği, içindeki içeriğe uyacak şekilde otomatik olarak ayarlanır.
Yüzde (%)
Değişken
Sütunlarınızın/satırlarınızın boyutunu bölümün/konteynerin yüzdesi olacak şekilde ayarlayın.
Piksel (px)
Sabit
Sütunlarınızın/satırlarınızın boyutunu, bölümün/konteynerin sabit sayıda ekran pikseli olacak şekilde ayarlayın. 1px = 1 inç'in 1/96'sı.
Görüntü Alanı Genişliği (vw)
Görüntü Alanı
Sütunlarınızın/satırlarınızın boyutunu, görünüm alanının genişliğinin (tarayıcı penceresi boyutu) yüzdesi olacak şekilde ayarlayın. Ör. Görüntü alanının genişliği 50cm ise, 1vw = 0.5cm.
Görüntü Alanı Yüksekliği (vh)
Görüntü Alanı
Sütunlarınızın/satırlarınızın boyutunu, görünümün yüksekliğinin (tarayıcı penceresi boyutu) bir yüzdesi olacak şekilde ayarlayın. Ör. Görüntü alanının yüksekliği 50cm ise, 1vh = 0.5cm.
Min/Maks
Diğer
Sütunlarınızın/satırlarınızın boyutunu minimum ve maksimum ölçüme ayarlayın. Bu seçeneği kullanırken kılavuz birimlerinden herhangi birini seçebilirsiniz.
Min İçerik
Diğer
Sütunlarınızın/satırlarınızın boyutunu asla bu minimum içerikten daha küçük olmayacak şekilde ayarlayın. 
Maks İçerik
Diğer
Sütunlarınızın/satırlarınızın boyutunu asla bu maksimum içerikten daha büyük olmayacak şekilde ayarlayın.
Hesaplama
Diğer
Sütunların/satırların boyutunu ayarlamak için kılavuz birimlerinden herhangi birini kullanarak bir hesaplama oluşturun.

Bu içerik yardımcı oldu mu?

|