Kayıtlar

Bootstrap etiketine sahip yayınlar gösteriliyor

Jasny Bootstrap

Resim
Bootstrap'ı araştırdıkça içinden bootstrap için çalışmalar içinde kayboldum. İnsanlar tasarım altyapısını kullanarak farklı farklı şeyler yapıyorlar. Sanırım bir kişi  Jasny  adıyla ufak bir paket oluşturmuş. İnput Masked Text'i araştırıken karşıma çıktı. Fazla bir aktivitesi yok fakat textboxı kendimiz maskedlemesi için basit olabilir diye düşünüyorum. "http://jasny.github.io/bootstrap/getting-started/" adresine ziyaret ederek inceleme yapabilirsiniz. Uygulamasına geçtiğimizde alt yapısı bootstrap olduğu için  daha önce anlattığımız konu  dan inceliyebilirsiniz diye düşünüyorum. Daha şu an buldugum için web sitesini inceleme yapmadım. Okuduğum kadarıyla aktaracağım size..

Bootstrap File İnput - Multi File İnput

Evet arkadaşlar bir projemin bir yerinde çoklu dosya yükleme olayını araştırıyordum. Bootstrap ın bir tasarımını buldum. Daha yeni deniyeceğim. İşe yararsa çok güzel bir görüntüsü var. Buradan sizlerlede paylaşacağım.. Proje Krajee den indirmiş bulunmaktayım. Projem bitince size de bir link oluştururum. İndirme Linki: (Daha Sonra Paylaşacağım..) Kısaca burada bir açıklama yapacağım. Tasarımda bootstrap kullanıyorum. Ve .Net yazmaktayım. Multi File gerekti. Araştırmaya başladım. Ve bu eklentiyle karşılaştırdım. Ekran görüntüsünüde sonra alacağım ama buraya şimdi kodları yazmam gerekiyor. Çünkü not defteri olarak burayı kullandıgım için sonra unuttursam buradan bakacağım. Head kısmına gerekli olan dosyalarımızı yükledikten sonra sayfaya çağırıyoruz.

Bootstrap Tablo Oluşturma

Resim
Tablo Çeşitleri -Basit tablo: Kod: <table class= "table" > ... </table> Görünüm:

Bootstrap Listeleme Seçenekleri

Resim
Html de listelediğimiz gibi Bootstrap da listeleme yapabiliriz. -Noktalı listelemek için: Kod: <ul> <li> ... </li> </ul> Görünüm:

Bootstrap Blockquote Seçenekleri

Resim
Yazılardan bir örnek vereceğim. Kod: <blockquote> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a

Bootstrap Typography 2.Bölüm

Evet arkadaşlar. Şimdi neden 2.bölüm yaptığımızı anlatayım. 2. bölüm bana daha eğlenceli geldi aslında. Hatta bütün yazı bittikten sonrada örnekleme yapabiliriz. 1.Yazılı Hizalama

Bootstrap Typography 1.Bölüm

Evet arkadaşlar. Biraz önceki konumuz biraz daha uzundu hizalama konusu fakat temel olarak yeterli olarak düşünüyorum. Eğer ileri konulara da gerekli olursa anlatırım. Evet girelim bakalım typography konusunda. Css de .h1,.h2,.h3,.h4,.h5,.h6 olarak tanımlanmıştır. yazı boyutları olarak hazır hızlı değişimi sağlarız. H1 en büyük, H6 da en küçük tagdır. Class olarak tanımlanmaz. Direk "<h1></h1>,<h6></h6>" olarak tanımlanır.

Bootsrapt Containers 2.Bölüm

Resim
2.Bölümde bölünmüş sayfa ve hizalamaları göstereceğiz. Bootstrap sayfayı toplamda 12 parçaya bölünüyor. Yani bir web sayfası düşünün 12 eşit hizaya bölünmüş. Aşağıdaki resimde de göstereyim.

Bootsrapt Containers 1.Bölüm

Containers yani türkçe karşılıgı kontyenerler hizalamada oluşturulan bir div sınıfı. Yani hemen kısaca örnek verilmesi gerekirse.. <div class= "container" > ... </div>

Bootstrap Mobile

Resim
İlk önce kodu yazalım sonra üzerine konuşalım. <meta name= "viewport" content= "width=device-width, initial-scale=1" > Tagımız bu. Bu olayı daha önce resimli olarak bu sayfada  paylaşmıştık. Daha önceki resimi burada da göstereceğim. Bu tagdaki olay telefon, tabletlerde ve web sitesinde boyutları ekran boyutuna göre ayarlama.

Bootstrap Html 5

Bootstrap css html 5 ile yazılmıştır. Yani html sınıfı html 5 dir. Zaten olması gereken buydu. Yeni teknoloji en son teknolojiyi kullanır. html 5  ile başlamak için: <!DOCTYPE html> Bunu en başa yazdığımızda sayfayı okuyan ve kullanıcıya yorumlayan browsera bu sayfa html 5 ile yazdığımızı söyliyoruz.

Bootstrap Css

Css Bölümünü ayırmaya karar verdim. Ufak ufak kısa yazılarla gerekli olan hepsini yazacağım. Tüm bootstrap notlarına ulaşmak için: http://altayolcay.blogspot.com.tr/search/label/Bootstrap%20Css Bootstrap Css İçin Tıklayın..

Sayfa Dizaynına Giriş

Resim
Sayfa dizaynına girmeden önce photoshop bir programda çizmenizi öneririm. Bu hem ne çıkaracağınızı bilmeniz için bence iyi olur hem bazı durumlarda hız kazandırır size. Ben A4 kağıdına yazıyorum, çiziyorum genelde. Hadi ufak tefek başlayalım konuya..

Bootstrap İndirme!

Tarih 18.02.2015. Ve bugünün tarihiyle sürümü Bootstrap v3.3.2. İndirme Sayfa Linki : http://getbootstrap.com/getting-started/ Hızlı İndirme Linki: https://github.com/twbs/bootstrap/releases/download/v3.3.2/bootstrap-3.3.2-dist.zip Eğer indirmeden uzaktan yüklemek istiyorsanız :

Bootstrap

Nedir Bu Bootstrap? Evet arkadaşlar. Ben tasarımcı değilim. Tamam html, css bilmekteyim. Fakat bunun renk kodları var güzel dizaynlar var. Bu beni aşar. Eminim bu bir çok yazılımcının derdidir. İşte burada bootstrap vb. hazır tasarım kodları devreye giriyor. Kısa kısa örneklerle not almaya çalışacağım.