Perşembe 26 Ocak 2023
Hakkında
Yazarlarımız
Reklam
Künye
İletişim
Webmaster.Kitchen – Türkiye'nin Webmaster MutfağıWebmaster.Kitchen – Türkiye'nin Webmaster Mutfağı

Bülten

Sosyal Medya Yasası Kabul Edildi

Binance ‘e Siber Saldırı

Webmaster.Kitchen – Türkiye'nin Webmaster MutfağıWebmaster.Kitchen – Türkiye'nin Webmaster Mutfağı
  • BAŞLARKEN
    • KOD
      • PHP
      • Asp.Net
      • Swift
      • MySQL
      • CMS
  • TASARIM
    • İpuçları
    • Çizim
    • Illustrator
    • Photoshop
    • Trendler
  • ARAYÜZ
    • JavaScript
    • HTML5
    • CSS
    • REACT
  • İPUÇLARI
    • API
    • Güvenlik
    • IDE
    • Framework
    • OS
    • Verimlilik
    • İçerik
      • Dökümantasyon
      • İpuçları
      • Nasıl Oluşturulur?
  • KAYNAKLAR
    • Tasarım
    • Kod
    • İş
  • GİRİŞİM
    • Finans
    • Girişimci
    • Nasıl yapılır?
  • ARAÇLAR
  1. Anasayfa
  2. Arayüz
  3. Grid.css – Web Geliştiricileri için Minimum Izgara Sistemi
 Grid.css – Web Geliştiricileri için Minimum Izgara Sistemi
Arayüz CSS

Grid.css – Web Geliştiricileri için Minimum Izgara Sistemi

Yazar : Bilal UÇAR 13 Eylül 2017 1 Comment

Bootstrap gibi daha büyük front end çerçeveleri kendi grid ayarlarıyla birlikte gelir. Ancak, önceden tasarlanmış sayfa öğeleri ve JavaScript bileşenleri şeklinde bir sürü dosyaya sahiptirler.

Çok daha küçük ve akıcı bir grid sistemi arıyorsanız, Grid.css‘i seveceksiniz.

Bu ücretsiz açık kaynak kütüphanesi, herhangi bir düzen için yapabileceğiniz geleneksel 12 sütunlu ızgaralı sistemle birlikte gelir. CSS gerçekten kullanımı kolaydır ve dosyanın kendisi yalnızca 560 bayttır (yani yarım KB’dir).

Başlamak çok kolaydır ve başlığınıza bir CSS dosyası eklemeniz yeterlidir.

Doğrudan indirme bağlantısını Grid.css ana sayfasında veya resmi GitHub repo‘sunda bulabilirsiniz. Bu dosyayı doğrudan kendiniz barındırmadan GitHub’tan gömmek için ham CDN sürümünü de kullanabilirsiniz.

Şimdi, sütun yapınızı istediğiniz herhangi bir öğeyi (div’ler, bölümler, vb.) kullanarak ayarlayabilirsiniz.

Bu genellikle bir .row elemanı (konteyner) ve birçok iç sütun elemanı içerir. Sütun sınıfları, konteyner içindeki toplam alanlarını tanımlamak için sayıları kullanır.

Demodan örnek bir snippet:

İstediğiniz sütun sınıflarının herhangi bir kombinasyonunu, yalnızca en çok 12 tane ekleyerek kullanabilirsiniz.

Bu, farklı satır düzenlerini kullanarak, istediğiniz sayfayı da yeniden yapılandırabileceğiniz anlamına gelir. Örneğin, üstbilginiz için geniş bir alan olabilir, ancak sayfa gövdesi için iki farklı satır / sütun ayarını kullanabilirsiniz.


Doğal olarak, bu kütüphane %100 ücretsiz ve açık kaynaktır; dolayısıyla istediğiniz gibi düzenlemeler yapmakta serbestsiniz.

Bu makalede Bootstrap gibi büyük bir CSS kütüphanesine ihtiyacı olmayıp minimal şekilde grid sistemini kullanmak isteyenler için Grid.css ‘ten bahsettik. Siz de düşüncelerinizi yorum yaparak bizlerle paylaşabilirsiniz.

Etiketler: css ızgara sistemi grid css ızgara sistemi minimal css kütüphanesi minimal grid css
Önceki Yazı
Sonraki Yazı

Bilal UÇAR (Website)

administrator

Front-end Developer @Webmaster.Kitchen. Front-end developer olarak çalışıyorum. Bu konuda öğrendiklerimi sizlerle paylaşmaya çalışıyorum. Siz de yaptığınız çalışmaları, edindiğiniz bilgileri paylaşabilirsiniz. Yorum alanı ile mutfağa katkıda bulunun.

1 Yorum

  • kasim says:
    13 Eylül 2017 at 22:20

    Yeni başlayanlar için çok güzel paylaşımlar yapıyorsun , ilgiyle takip ediyorum seni.Başarılarının devamını dilerim.

    Reply

Yorum Yap Yorumu İptal Et.

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

Taze Yazılar
Güncel

Sosyal Medya Yasası Kabul Edildi

14 Ekim 2022
Blockchain

Binance ‘e Siber Saldırı

8 Ekim 2022
Blockchain

Binance ‘den Ücretsiz Eğitim

5 Ekim 2022
Güncel

Japonya için Yenilenen Corolla

4 Ekim 2022
© 2021 Webmaster Kitchen. Tüm Hakları Saklıdır.