Stil ve Düzen Değişiklikleri
İçindekiler
Kısaca
Stil ve düzen değişiklikleri doğrudan kayan editör ile yapılabilir. Bu, Varify.io sayfanızda yüklendikten sonra hemen görünür olur. Optimize etmek istediğiniz öğeye tıklamanız ve değişikliği açılır menü üzerinden veya istenen stil seçeneğini yazarak ayarlamanız yeterlidir.
Stil ve Düzen Seçenekleri
Floating Editor ile aşağıdaki seçenekler kullanılabilir:
- Dimensions: Bir öğenin genişliği ve yüksekliği
- Location: Bir öğenin web sayfası üzerindeki konumlandırması
- Typography:
- font-family: Yazı tipi
- font-size: Yazı tipi boyutu
- font-weight: Yazı tipinin kalınlığı
- text-align: Yatay metin hizalaması
- color: Metin rengini tanımlar.
- text-decoration: Metin örneğin altı çizili veya üstü çizili olabilir.
- line-height: Bir satırın yüksekliğidir.
- word-spacing: Bu seçenek yazı tipinin genişliğini artırır veya azaltır.
- white-space: white–space aracılığıyla, kaynak metinde bulunan satır sonlarının ve boşlukların tarayıcıda nasıl gösterileceği belirlenir.
- Background:
- background-color: Bir öğe için arka planın rengidir.
- background-image: Bir öğe için arka plan görseli. Arka plan görselinin dosya formatı JPG, PNG, SVG, webP veya GIF olabilir.
- background-style: Herhangi bir şey belirtmezseniz, arka plan grafiği tam boyutuyla arka plana yüklenir. Öğenin yüksekliği veya genişliği arka plan grafiğinden daha küçükse, grafik otomatik olarak kırpılır.
- background-repeat: Dahil edilen bir arka plan grafiğinin tekrar davranışıdır
- Border:
- margin: Bir öğenin çevresindeki öğelere olan dış mesafesinin tanımıdır.
- padding: Bir öğenin çerçevesine olan iç mesafesini tanımlar.
- border-style: border-style CSS özelliği, bir öğenin kenarlıklarının dört tarafının stilini ayarlar.
- border-width: border-width özelliği, bir öğenin tüm kenarlık genişliklerini belirler.
- border-color: border-color özelliği, bir öğenin tüm kenarlık renklerini belirler.
- border-radius: border-radius özelliği, bir öğenin köşelerinin ne kadar yuvarlatılacağını belirleyen yarıçapı belirler.
- Layout:
- float: Bununla bir öğeye, üst öğesinin sol veya sağ kenarına hareket etmesi talimatını veririz. Bu sadece öğenin kendisini değil, özellikle "floated" öğeyle ilişkili diğer öğeleri de etkiler.
- vertical-align: Tablo hücrelerindeki görselleri ve metni bir taban çizgisine hizalar. Taban çizgisi (baseline), bir satırdaki harflerin çoğunun üzerinde durduğu görünmez bir çizgidir.
- overflow: Öğeler, kapsayan bloğa sığmayacak kadar büyük olduğunda, içerikleri herhangi bir dikkate alınmaksızın kapsayan bloğun dışına taşar. CSS overflow, öğenin taşan kısımlarını gizleyerek kalan kısmın kapsayan bloğa sığmasını sağlar.
- opacity: Bir öğenin opaklığı. Değerler 0 ile 1 arasında olabilir. 0 tamamen şeffaf anlamına gelir. 1 tamamen görünür anlamına gelir.
- z-index: z-index özelliği, öğelerin çıkış ortamında arkadan öne doğru sıralanma düzenini belirtir. Bu, öğeler üst üste bindiğinde önemlidir. Daha büyük bir z-index değerine sahip öğeler izleyiciye daha yakındır ve daha küçük bir z-index değerine sahip öğelerin üzerine binebilir.