Hoşgeldiniz dersimize geri dönün, şov sayfasını şekillendirmeye odaklanacağız.
Bu yüzden şov sayfamız şu şekildedir.
Burada hiçbir şey yapmayan düğmelerle küçük bir naf barımız var.
Kampın adıyla bir H-1 sahibiz.
Ve bir görüntü ve bir açıklama var ve yeni bir yorum eklemek için bir düğme var ve daha
sonra tüm yorumlar görüntülenir.
Her biri küçük bir paragraf.
Dolayısıyla amacımız biraz daha benzemek.
İşte burada bir kenar çubuğum var.
Haritayı henüz sunmayacağız, ancak harita için yer açacağız ve daha sonra
ana içeriğimizin açıklamasına sahip olacağız.
Bazı metinlerde, derecelendirmeleri henüz yapmayacağımız başlığı, ancak o zaman bunun gibi görünecek bir değerlendirme
listesi de bulacağız.
Kendi küçük kutuları orada birkaç tane tutacak küçük bir düğmem var.
Genellikle biraz daha styled.
Bunu ekleyebiliriz ve kaç tane inceleme kaldığını yazıyor.
İşte bu yüzden amaçladıklarımız.
Ve başlamak için sadece önyükleme ızgarasına odaklanacağız.
Önyükleme ızgarasının 12 ünite olduğunu unutmayın.
Bu küçük yan çubuk için onlardan üçünü atayacağız ve sonra ana
içerik için dokuzu ekleyeceğiz.
Aslında bir şeyi değiştirmeye başlamadan önce v 5'de çalıştığımı belirtmek istiyorum.
Bu nedenle, takip etmek isterseniz, bu değişikliklerin hepsi V 5 olacaktır.
Ve bunu yapmamın nedeni, özel bir stil sayfası hazırlamamız gerektiğidir.
Halka açık dizinde ve önemli değişiklikler yapan birkaç şey daha sunmamız gerekecek.
Bu yüzden ayrı bir sürüm yapmak istedim.
Ancak bunu yapmadan önce yapacağımız ilk şey bu önyükleme konteynerinin tamamına bir
konteyner eklemektir.
Öyleyse şunu göster E. J. konteynerle sınıfı bir div ekleyecek ve konteyneri bunun gibi yapacak
ve içindeki her şeyi koyacağız.
Ve kenar çubuğunu ekleyerek başlayacağız ve burada sahip olduğumuz bazı kukla verilerle dolduracağız.
ve bu satırda bir sınıfın sütun orta sınıfında olduğu başka bir div'e sahip olacağız.
Dolayısıyla DIVX ve bunun sınıfın pro eşittir olması gerekiyor
Ve sonra burada bir paragraf ekleyeceğiz ve Joachim'in yazdığı bu metni alacağız.
Bu sınıfın öncülük ettiği bir paragraf, ve o zaman sizi şimdi kampa sokacağız, şimdilik
bunun sonunu değiştireceğiz.
Ama evet kampı ve daha sonra bu küçük liste öğelerini eklemek için sınıfla bir div
yapacağız; liste çizgi grubu ve sonra burada, müttefiklerden bir demet ekleyeceğiz, her müttefiki bir grup liste sınıfı sınıfı var.
Ve içeride sadece bazı kukla veriler ekleyeceğiz ve bunu sadece bilgi 1 olarak adlandıracağız ve
daha sonra bu bilgiyi bilgi 3'e kopyalayacağız.
Ve sonra şimdi bunun neye benzediğini görelim.
Sayfayı yenilemek için burada bir kenar çubuğumuz var ve bu öğelerden birini başlatmak için seçeceğim.
Ve tek yapmamız gereken aktif bir orantıyı eklemek.
Taze olursak şimdi bir tanesinin aktif olduğunu görüyoruz.
Ve bu gerçekten de sadece orada yer alan bir yer tutucudur, bu yüzden boşluklarımız
pek yoktur ancak yine de oradaki gerçek verileri ve haritayı ekleyeceğiz.
Ve şunu belirtmek için, haritanın sonunda bu orta üç sütun sonunda gideceğim, ancak
henüz değil.
Tamam, bu bir kenar çubuktur.
Şimdi ana içeriği ekleyeceğiz.
Bu yüzden başka bir sütuna ihtiyacımız var ve bu sınıf sütun orta 9.
Ve bunun yerine, H-1'e resim koymamız gerekiyor ama hepsinden önce, aslında ana
sayfadaki gibi bu küçük resimlerin birinde olduğunu fark edeceksiniz.
Bunların her biri küçük resim.
Aynı şeyi başlığın, yorumların ve tüm bunların görüntüsünün etrafında yapacağız.
Dolayısıyla bir div ekleyeceğiz ve bu div öğesinin sınıfına eşit olacak.
Ve sonra bunun içinde görüntü ekleyeceğiz ve halen daha önce yazmış olduğumuz imaj edeceğim ve
sadece oraya koyacağız.
Bu bizim kamp imajımız olacak.
Ve sonra da çizme işleminin bize verdiği Dasch yanıtlı sınıfına bir sınıf eklemek istiyoruz.
Oraya gidiyoruz.
Onu sakla.
Ve şimdi sahip olduğumuz şeylere bir göz atıp yenilersek, en azından görüntüyü ve içeriği
doğru yerde buluruz.
Bunun istemediğimiz bir noktada olduğu bir problemimiz var.
Bunun tüm yol boyunca ilerlemesini istiyorum ve sonunda bazı özel CS'lar ile bunu halletmek zorundayız.
Ve şimdi geri dönüp burayı, kamp alanının adını ve ardından veritabanında gerçekten bulunmadığımız
gecelik fiyatı belirtecek şekilde buraya ekleyeceğiz.
Bu yüzden sadece şifreleyebiliriz.
Şimdi bunu yapalım.
Ve bu başka bir div ve bu bir başlık yazısı tam dolu.
Ve sonra orada bir H ekleyeceğiz.
Ve bunu sağa doğru çekeceğiz ve sınıf eşittir çizgiyi sağa çekip, sonra buraya koyduğumuz
her şey fiyatı olacak.
Ve yine bir gece 9 dolarla başlayacağım, sonuçta veritabanından gelecektir.
Taze olursak Şimdi sağ tarafta bir gece 9 dolar alıyoruz ve daha sonra burada
sol tarafta kopyalayacağımız kampın adını almak istiyoruz.
Dolayısıyla onu hemen altına koyacağız ve çekme hakkı eklemezsek, aklındakilerden daha büyük
olmasına rağmen otomatik olarak sola geçecek ve bunu daha küçük bir H'ye çevireceğim ve ben gidiyorum orada
bunun gibi bir çıpa etiketi eklemek ve kampa adını demir atma etiketi içine koymak.
Ve bunun arkasındaki fikir, sonunda ben geri döndüm.
Bu, gerçek kampa ya da bir şey yazmaya gidebileceğimiz Park Hizmeti sayfasına bir bağlantı olmalıdır.
Şimdilik, sadece bir yere bağlantı yok.
TAMAM.
Yani biz de içerdik.
Bir fiyatımız var.
Şimdi açıklamayı tekrar ekleyelim.
sadece bir paragraf etiketi olacak ve daha sonra açıklamamıza hangi kamp açıklaması ekleyeceğiz.
Dolayısıyla bu
Ve biraz zor geliyor çünkü şu anda büyük bir aboneliğiniz yok, bu yüzden
yapmak isteyebileceğimiz bazı Lorem Ipsum ile veritabanını görüp görmek ve bunu çalmak için
gideceğim ve ben kopyalayacağız ve tohum dosyasına geri dön.
Sonra tohum dosyamız yerine, üçünün hepsinin tanımını değiştireceğim.
Sadece filan filan değil, aynı şeyi yapın.
Artık Lorem Ipsum'dan biraz daha sahibiz ve kurtaracağız.
Ve daha sonra bunu yürürlüğe koymak için sunucuyu yeniden başlatmamız gerekecek çünkü bu veritabanı alacak.
Ve sonra tekrar gidip kamp sayfalarına dönelim.
Üç kampımız var.
Ancak şimdi bazı metni daha meşru bir açıklaması var.
Tamam harika.
Şimdi üzerinde çalışmamız gereken şeylere bir göz atalım.
Birkaç küçük şey var.
Şu an için inceleme sayımında yıldızları yalnız bırakacağız ve yorumları aşağıya taşıyacağız.
E. şovuna geri dönelim. J. iyi bir sınıf veriyoruz.
Evet dosyamız artık tohumları kapatabiliriz, çünkü şimdi yapacağımız şey, aynı sütunda olmasını istediğimizden, sütun orta
dokuzunun içinde
Aynı miktarda yer kaplıyor.
Bunu yapmak için küçük resimden sonra buraya gidin, böylece bu resim ve resim yazısı burada küçük resim.
Öyleyse div sınıfını ekleyecekler.
Eşittir.
Ve daha sonra bunun iç kısmı açılıp gidilecek ve burada yorumları eklemek için
döngü yapacak.
Ancak düğmeye kolunun düğmesini ekleyerek başlayacağım ve basit bir div yapacağız ve
bu div doğru bir metin sınıfı sınıfına sahip olacak.
Ve sonra orada, yeni bir yorum yaratmamız gereken bağlama
etiketini ekleyeceğiz.
Sadece buraya koy.
Bu uzun bir şey ama onu yeşil yapmasını sağlayan Button butonu başarısı sınıfına sahip bir bağlantı etiketi
olduğunu unutmayın.
Ancak ref gerçekten çok uzun bir bölüm.
Kamplar, kamp alanını eğik çizgi eğik çizgi (slash) yorumları yeni eğik çizgi olarak kaydedecek, kaydedilecek ve yenilenecektir.
TAMAM.
Böylece sınırdaki güzel gri arka planı bize veren kuyuya sahip olduğumuzu görebilirsiniz.
Burada yorumları ekleyeceğiz.
Dolayısıyla, bir sonraki aşamada yapılması gereken şey, yorumlar boyunca döngüydü ve zaten yaptık.
Fakat her biri için bir paragraf yapmaktan ziyade aslında ayrı bir satır yapacağız.
Bu yüzden sana bunu kopyalayıp keserken neye benzediğini göstereceğim.
Ve bu ek paragrafı silebiliriz, sağdaki metnin hemen arkasına koyacağız.
Ve bunu düzgün yapalım.
Dolayısıyla, döngülerimiz var ve sonra her yorumu tekrarlayacağız ve her
bir div sınıfına eşit olan satır için bir div sınıfı satırı ekleyeceğiz.
Ve sonra her birinin içinde başka bir div sınıfı sütun ortalığına 12 eşit olacak ve kaydedeceğiz.
Burada sahip olduğumuz şeylere bir göz atarsak, yazar olarak adlandırdığımız kullanıcı adı e-posta eğik çizgi kullanıcı
adıyla sonuçlanır.
Ve sağdaki 10 gün önce, şimdi ve sonra gerçek yorum sonraki şifreyi verecek
olan zaman var.
Bu işi yapmak için bir şeyler yapmamız ve ardından sağdaki metin sağa çekip bir şeyler
yapmamız gerekiyor ve ardından gerçek açıklama için bir paragraf eklememiz gerekiyor.
Bu yüzden deneyelim ve buraya girelim.
Kolon medyamız 12.
Ve bunun içinde sadece yorum yazarını ekleyerek başlayacağız.
O halde şunu hemen orada ekleyelim.
Ve daha sonra, bir aralık ekleyeceğiz ve bu sağda olacak.
Dolayısıyla klasik çekmeyi doğruca ekleyeceğiz.
Ve sonra burada, on gün önce şimdilik ekleyeceğiz.
İçinde sadece zor kod var.
Ve sonra yapmak istedikleri son şey aslında yorum metnini gösterir.
Bu yüzden burada bu açıklama metnini alacağım ve bunu, burada zaten sahip olduğumuz
kendi paragrafının içine koyacağız, bunun dışında, bunu sütun içine taşımak istiyoruz, burada yazarımız var ve 10
gün gibi .
Onların aynı sütunda birlikte olmasını ve şimdi kaydedilmesini ve geri dönmesini istiyoruz.
Bakalım ne alıyoruz.
Tamam.
Bu yüzden bir yoruma sahibiz.
Bu kadar.
Ancak bir düğmenin yeni bir yorum eklediğini görebilirsiniz.
Çalıştığından emin olun.
Ve yorumlar burada gösterilir.
Oy puanı kaçırıyoruz.
Bu yüzden biraz tuhaf görünüyor, ancak şimdilik iyi.
Ne yapmak isteyebiliriz, bir ya da iki tane daha yorum ekleyebiliriz.
O zaman buraya dönelim ve biraz daha lorem ipsum kullanalım.
Bu yüzden sadece bunun parçalarını kopyalayıp yorumlar olarak ekleyeceğim.
Birazını kullanın ve yazar burada kamp yapacaktır.
Dede.
Gönder.
TAMAM.
Bu yüzden yorumlarımızı burada iyi hale getiriyoruz.
Çalışıyor.
Eklemek istediğim bir boşluğa sahibiz.
Burada sahip olduğumuz şeylere bir göz atarsanız, ekranda gösterip gösteremeyeceğinizi bilmediğim çok soluk
bir çizgi var.
Aralarında biraz boşluk bırakan çok hafif bir çizgi var ve bu işi yapmak için yapmamız gereken tek
şey bir h r eklemek.
Bu metnin hemen ardında, sadece yatay bir kurala eklediğimiz düğme var ve eğer yenilersek, şimdi orada
biraz yer var.
Bir düğmeniz var ve tüm yorumları kısa sürede görüntülenecek.
Neden kullanıcı adını oluşturmuyoruz.
O zaman buraya geri döneceğiz ve bunu zaten yaptık ve kurtulduk ama geri
gidip yazarla güçlü bir etiket ekledik ve görmeleri biraz daha kolay olacaktı.
Oraya gidiyoruz.
Hala büyük değil ama şimdilik yeterince iyi.
Yani aslında şu an için yapmamız gereken tüm önyükleme.
Ama hala bitmedi.
Geriye dönüp bitmiş ish versiyonuna bakarsak, resmin bütün minyatür resmin tamamını kapladığını
ve bunu yapmadığını göreceğiz.
Aynı görüntüyü kullanmam için bir noktaya değinmiş olsam da, gerçek görüntünün kendisi ile ilgili değildir.
Sorun stilize düşüyor.
Ve yapmak istediğimiz, içeri girip, konteynerle yüzde yüz almasını söylemek.
Bu yüzden sana sadece teftiş edebileceğimizi göstereceğim ve buradaki müfettiş için harika bir kullanım.
Burada seçebiliriz, sonra da yüzde 100 ile bir stil katabiliriz.
Ve işte gidiyoruz.
Bu yüzden yapmak isteyeceğimiz bir şey var.
Hâlâ çok hafif bir fark var, ki bu da bizim bu konuda küçük
bir alanımız var.
Ve kurtulmak için yapmak istediğimiz tek şey gerçek küçük resme gidin
ve burada bulunan küçük resmi seçin ve bu doldurma sıfırını verelim.
Ve bakalım bakalım bakmamız istediğimiz şekilde veya nereye bakacak olursak bu şekilde
görünüyor.
Biraz daha boşluk ekleyeceğiz.
Burada bazı boşluklar yapıldığını görebilirsiniz, şimdi bunu düzeltebiliriz.
Ayrıca inceleyerek ve biz aslında onu tamir etmiyoruz hatırlamak hatırlayarak sadece tarayıcıda test
ve biz geri gidip aslında kendi stil sayfasında bu değişiklikleri yapacağım.
Dolayısıyla, yapmak istediğimiz, burada bu kutu olan resim yazısı tayfasında biraz dolgu eklemek.
Ve istediğimiz Padam sağ üst ve altta solda ve dokuz veya 10 piksel olacak.
Bu yüzden dokuz x doldurma yapacağız.
Ve işte gidiyoruz.
Orada güzel bir aralık buluyoruz.
Yapmak istediğimiz şey bu tarzı alıp aslında yazacağımız bir stil sayfasına eklememiz
değil