Bootstrap Twitter Css Framework Giriş
1604 görüntüleme

Merhaba arkadaşlar,

Bootstrap css framework üne yavaştan giriş yapmaya başlayalım. Öncelikle nedir bu bootstrap onu bir bilelim.

Bootstrap twitter tarafından çıkartılmış bir css kütüphanesidir. Adamlar aklınıza gelebilecek her türlü css i sizin için class olarak hazırlamış sizin kullanımınıza bırakmış. Sizlerin tek yapması gereken o classları kullanmak. bunları nasıl kullanacaksınız nasıl işlem yapacaksınız onları nasıl düzenleyip kendi sitenizi nasıl hazırlayabilirsiniz bunları benim anladığım kadarıyla anlatmaya çalışacağım. 

İlk olarak  projenize dahil etmeniz gereken dosyaları indirmek için 

https://github.com/twbs/bootstrap/releases/download/v3.3.2/bootstrap-3.3.2-dist.zip

yukarıdaki linkten dosyaları indirdiğinizde 

css

fonts

js

dosyalarını projenize kopyalayın daha sonra tanımlamanızı yapın

<link rel="stylesheet" href="css/bootstrap.min.css" />

<script src="js/bootstrap.min.js"></script>

bu ikisi bootstrap ı artık kullanmanız için yeterli olacaktır.

 

bootstrap ile yapacağınız site tamamen responsive tasarıma sahip olacağından her türlü bilgisayarda, taplette ve cep telefonunda uygun şekilde açılacaktır.

bildiklerimiz.net gibi bunuda bootstrap ile yaptık.

Mobil versiyonlar için meta taglarına aşağıdaki kodu da eklemeniz gerekmektedir.

<meta name="viewport" content="width=device-width, initial-scale=1">

bu meta tagı sitenizin mobil versiyonunu desteklemesini sağlayacak ve otomatik ekran boyutuna göre site kendini ayarlayacaktır.

Bootstrap bir web sayfasını 12 grid yani parça üzerinden değerlendirmektedir. yapacağınız sitelerin grid sisteminde olmasını istiyorsanız bu 12 sayısını iyice aklınıza yerleştirin çünkü kullanım bunu üzerine olacaktır.

bootstrap ı kolay ve işe yarar anlaşılması için parça parça anlatacağım ve en son bu parçaları birleştirdiğimizde ortaya bir web sitesi çıkarmış olacağız. 

sizin istediğiniz bir örnek web sitesi varsa onu ya bootstrap la yapabiliriz veya bildiklerimiz.net tarzı bir site de tasarlayabiliriz veya farklı bir site tasarımı da olabilir isteğiniz olursa yorum yapabilirsiniz. olmazsa şayet ben kafama göre takılırım :)

bir sonraki yazıda görüşmek dileğiyle.

 

Bildiklerimizi paylaşıyoruz, bilmediklerimizi öğreniyoruz.
biz bunları yapıyoruz ya siz...
© 2016 Bildiklerimiz.Net Tüm hakları saklıdır.