Bu birime hoş geldiniz, Bootstrap adında yeni bir araç tanıtacağım
ve bootstrapped dotcom'u alıyorum.
Ve sadece ön tanıtım dosyasının ne olduğunu ve neden onu kullandığımızı açıklamak için bu tanıtım videosunda birkaç
dakikanızı ayırmak istiyorum.
Ve sonra da önyükleme kullanan sitelere birkaç örnek gösterebilirsiniz.
Öyleyse sadece resmi önyükleme metnini okumaya başlayalım.
Bootstrap, Web'de duyarlı mobil ilk projeler geliştirmek için kullanılan en popüler TMLC
SS javascript çerçevesidir.
Biraz kıralım.
Önyükleme son derece popülerdir.
Aslında bu, temelde en çok kişinin kullandığı en çok insanın yardım almak için eklendiği
anlamına gelen ve temelde bütün bu önyüklemenin tek bir başarı dosyası ve tek bir javascript
dosyası olduğu anlamına gelen, merkez sağdaki en yıldızlı ve çatallı depodur. .
Şimdi bu dosyalarda çok fazla CSA ve çok sayıda javascript var ancak bunlar sadece
iki dosya ve kendi uygulamalarımıza ekleyebiliyoruz.
yazmak zorunda kalmadan hızlı bir şekilde çalışmak için iyi görünümlü siteler yapmamıza yardımcı oluyor.
Temelde başkasının kodunu alıyoruz ve Bootstrap'den kendi uygulamanıza ekledik ve duyarlı ve bize
kendi kodumuzdan bir ton
Bu derste sana göstermek için iki temel sebep var.
Birincisi, çok popüler olması.
Birçok yerde bunu kullanıyor.
Pek çok şirket geliştirici kullanıyor ve sadece bilmeye değer.
Ancak ikincisi, bu derste güzel görünümlü Web sitelerini oldukça hızlı bir şekilde oluşturmamıza yardımcı olacak.
biz 10 15 dakika içinde gidiş olsun ve biz oldukça iyi görünüyor olacak.
Düğüm ve ifade ve Mongo ve mongo ve diz derinleri ve bu karmaşık arka ve mantıkların
hepsine odaklanırken bir şeyler öğrenip geri döndüğümüzde yine de bir saat ya da iki saat ayırmadan iyi
görünen bir şey yapabilirsiniz. video önyükleme takabilirsiniz bir şey stil ve
Yapacağım sonraki şey rıhtıma hızlı bir tur vereceğim ancak önyüklemenin ünlü örnek
belgelerine güzel örnekleri var ve bu web sitesinde gerçekten mantıklı önyükleme kullanıyorlar.
Bu yüzden Cs'leri tıklayarak başlayalım ve önyükleme tek bir CSSA dosyası olduğunu ve bu
CSSA dosyasında tek bir javascript dosyası olduğunu belirtti.
Bedava elde ettiğimiz bir sürü şey var.
Bu yüzden Buttons 'a bir göz atalım.
Dolayısıyla bir düğme yapmak istiyorsak ve uygulamanızın içine dahil olan önyükleme yapmışsak,
bu sınıfı aslında Beati ve PTEN varsayılanı olarak ekleyebiliriz ve bu düğmeleri alırız.
Farklı renkler üretebiliriz.
Formlara bir göz atalım.
Buraya hoş geldiniz.
Ayrıca, sitedeki her şeyin tepkisel olduğunu unutmamak da çok önemlidir, böylece ekranın genişliğine
yanıt veren şeyleri elde ettiğimizi görebilirsiniz.
Ayrıca farklı form türleri de var.
Farklı parçaları birleştirebilirsiniz.
Yani burada bir formlu bir düğme kullanıyorlar.
Bu, Lego parçaları önyükleme gibidir ve uygun bir şekilde bir araya
getirebileceğiniz ve sitenize ekleyebileceğiniz birçok Lego parçası parçasıdır.
Bu bileşenlerin çoğuna devam edeceğiz.
Bu büyük parçaların çoğundan bir zaman onunla çalışmaya başlayıp bootstrap kodunu kendimiz yazıyoruz.
gibi şeyleri içeren daha büyük önyükleme parçalarını içeren sonraki sekmeyi ne zaman göstereceğiz.
Şimdilik şimdi ve ne zaman bileşen bileşenleri, kullanabileceğimiz ve nav çubukları
Ve bu, muhtemelen bir sürü kodla görebileceğiniz kadar çok sitenin kullandığı önyüklemenin
en popüler yönlerinden biridir.
Çok gibi görünüyor ama sana garanti ederim ki sıfırdan bir NAV çubuğu yazsak
olandan daha az olur.
Ve bu, açılır kapanış formuyla birlikte gelir ve sayfanın üst kısmına kaydırılan bazı
sabit olan bazı çubukların farklı renkleri vardır.
çubuklarında bazı içeriği sergilemek için bir yol olan Jumbotron gibi başka bileşenler de var.
Web sitenizin ilerleme
Ve hepsi önyükleme ile birlikte geliyor.
Dolayısıyla şu anda önyükleme tüm bu parçalara gelip gelmediğini merak ediyor olabilirsiniz ve önyükleme desteğini
kullanan her site aynı görünüyorsa, önceden biçimlendirilmiş durumdalar.
Ve cevap evet ve hayır.
Bu, sitenin önyüklemeyi nasıl kullandığına bağlıdır.
bir önyükleme aygıtı kullanan bir projenin, bu temel bileşenleri kullandıkları için gerçekten bootstrap
kullandıklarını söylemek zorlaştığını ve daha sonra kendi stilinizi en üstte yazabileceğinizi iddia ediyorum.
Bir şirketin veya
Renkleri değiştirmek yazı tiplerini değiştirmek bazı efekt efektlerini değiştirir.
Aynı renkleri ve bootstrap ile birlikte gelen her şeyi kullanmak zorunda değilsiniz, ancak bu, yerleşik
Bootstrap stillerini kullanırken doğasında olan her hangi bir şeyin kötü olduğu anlamına gelmez.
Ve kesinlikle her ikisini de yapacağız.
Dolayısıyla, bir site oluştururken ve odak noktası yalnızca ön uçta değilken, yalnızca hızlı bir
şekilde görünebilen bir şey yapmak istiyoruz.
Temelde prototip ön uç önyükleme kullanacak ve pek çok parçayı değiştirmeyeceğiz.
Fakat eğer biraz daha büyük bir şey üzerinde çalışmak ve hiçbir
şey değiştirmeden önyükleme kullanmak gibi görünmek istemiyorsak, daha sonra içeri girip kendi stillerinden bazılarını ekleyelim, temel
olarak bir sprey boya katın önyüklemenin üstünde.
Yapmak istediğim sonraki şey, önyükleme destesi ile inşa edilmiş sitelerin bazılarını göstermek ve Buddh gezisinin
aslında bu sitelerin vitrine çıktığı resmi bir Web sitesine sahip olmak.
Expo'yu tıklarsanız zaten açmış olurum.
Onların vitrinde çok güzel olduklarını ve ilham kaynağı bir önyükleme bandı kullandığını görebilirsiniz, bu nedenle bunları ve
yeni sekmeleri açmak için bazılarını açabiliriz.
Bunlar sadece en yenileri.
Bu sitede yüzlerce kişi var.
Onların tonlarını ve tonlarını görebilir ve kaydırmayı ve kaydırmayı sürdürebilir ve daha sonra birkaç yaşına
gidebiliriz ve orada kullanan çok farklı siteler var.
Ve hepsi aynı görünmüyor.
Evet, belki birçoğunun bir nav çubuğu var.
Belki birçoğu bu tam ekran büyük resim düzenine sahip ancak bu, tamamen kendinden sorumlu
olduğu önyüklemeli bir şeyden çok bir tasarım trendi.
Öyleyse bunlardan bazılarına bir göz atalım.
Bu, Web sitesi şablonlarını gerçekten yapan bir şirket olan yaratıcı Tim.
Ve gördüğünüz gibi, bu güzel resim ızgarımız var.
Çok duyarlı.
Bu işi küçültersem, küçük gezinti çubuğunu burada buluruz.
Yani bu, her şeyin bu ızgarada düzenlendiği şekilde bir önyükleme bileşeni.
Bunun için kısmen Bootstrap sorumludur, ancak varsayılan olarak yerleşik Bootstrap düğmelerini
kullanmadığını da görebilirsiniz.
Onları değiştirdiler.
İşler farklı görünüyor.
Bence bu, gerçekten güzel ve güzel bir site olan önyükleme destesi.
İşe yarıyor ve bootstrap kullanıyor ancak bootstrap yüzde 100 güvenmiyor.
Şimdi bir veya iki tane daha göz atalım.
Bu yüzden buna bir İnduus denir veya böyle bir şey endeksler.
Görünüşe göre, insanların kullandıkları dijital ürünleri tasarlar ve üretirler.
O halde buraya kaydıralım.
Elimizdeki verilere bir göz atın.
Muhtemelen önyükleme ızgara sistemiyle inşa edilen ve daha önce bahsettiğim gibi
organize etmek ve düzenlemekte yardımcı olan bazı içeriklerin Pearcey SS'de kötü olması zordur.
Daha da iyiye gidiyor ancak önyükleme gerçekten bizim uygulamamızda şeyler düzenlemek bize yardımcı olmak için gerçekten yararlıdır.
çubuğumuz var, burada bir gezinti çubuğu var, bu nedenle bootstrap'a gitmek gerçekten eğlenceli. Expo, önyükleme yapmak için
kullanılan bazı projeleri keşfetmek için biraz zaman ayırın ve onu nasıl kullandıklarını ve şirketlerin
değişmekte olan tüm farklı yollarını öğrenin. kendi yazı tiplerinde kendi renklerini ekleyerek, çok sayıda ve
çok sayıda sitenin kullandığı temel bileşenlerin hangileri olduğunu ve neden önyükleme desteğini kullanmaya karar verdiğini anlıyoruz.
Ve alt
Bence bu birimdeki bir videoyu ve seyir çubuklarını ve her
şeyin tepkiselliğini tahsis edeceğimiz ızgaralı sisteme gerçekten inanıyoruz.
TAMAM.
Böylece, tamamlamak için size yapacağımız basit bir site göstereceğim.
Bu bizim ağırbaşlı oyuncumuz.
Mükemmel kedi ruh eşinizi bulmanıza yardımcı olur ve bootstrap kullanır.
Morgan düğmelerine kaydolduğumuz gibi, burada bir nav barımız olduğunu görebilirsiniz.
Bu küçük ikonları alıyoruz, o zaman burada metin var, küçük etiket satırı ve daha sonra düğmemiz var.
Ve sonra nesneleri yeniden boyutlandırırken her şey yanıt veriyor, şeylerin dolaşmakta olduğunu görebilirsiniz.
Ve en önemlisi, o küçük hamburgeri alıyoruz ve mobil dostu bir barımız var.
Bu birimin sonunda, romantik ilişkilerde insanları ve evcil hayvanlarla eşleşen bu sahte
başlangıç ​​açılış sayfasını oluşturma üzerine çalışacağız.