11 Mart 2014, Salı

Apple - Bölüm 1 Gibi Bir Beş Esnek Kutuları Düzen Oluşturma

Hey bu Ralph haber video istiyorum nasıl göstereceğim olduğunu Apple, beş esnek kutuları düzeni yapar ve yeni bir kural damat yani Apple sahip yapmaktan çok basittir profesyonel görünümlü düzen bir üst bu büyük bir kabı var ve daha sonra alt kısmında ekran onlar bu dört tane eşit büyüklükte konteyner ve görüntüleri ayak soğutmak ya da öyle çok basit bir web sitesi var ama serin ve profesyonel Ben grafik çünkü çoğunlukla düşünüyorum görünüyor onlar beni ve bir kaç şey göstermek izin böylece dahil ettik senin öyle demek bir sıvı söz özlüyor Farklı büyüklükteki monitörlerde farklı boyutta görüntüler

ile biraz değiştirmek ancak bazı aralık maximums ve minimum olan bazı vardır ben benim ekran dışarı geniş germek gibi şimdi sağ tarafında görebilirsiniz çünkü Bu kayıt ama onlar sadece bazı beyaz boşluk ekliyoruz sol taraf

ta görebilirsiniz bu yüzden benim küçük ölçü kullanarak burada bazı bilgiler go ahead ve izin alet ve biz bundan ne söyleyebilirim Orada Apple'ın düzeni maxes olduğunu 1440 1440 geniş çözünürlükler

“Apple ve diğer birçok web siteleri dört küçük kutular altında o üstüne bir ana kutu ile basit ve serin, esnek düzeni kullanmak ve. Sitesi minimum ve maksimum geni...”
Ralph Phillips

de max Ben bir arıyorum Ne aşağı küçültmek eğer in bir zihinsel not edin aşağı bu siteyi küçültmek arıyorum. altındaki yatay kaydırma ilk görünüm Aslında Mia ekran biraz bu yüzden gerçekten çok yakında görmek olarak size sıyrılıyor getirir Yatay kaydırma scrollbar Ben çok az vurmak biliyorum Sağ orada da hakkında yine benim ölçü aracını kullanın ve biz bunun tam olarak doğru alamadım benim numaraları dayalı varsayabiliriz ama onun en az bahse hazırım alma 1024 yak

Apple - Bölüm 1 Gibi Bir Beş Esnek Kutuları Düzen Oluşturma Resim 1 Apple - Bölüm 1 Gibi Bir Beş Esnek Kutuları Düzen Oluşturma Resim 2 Apple - Bölüm 1 Gibi Bir Beş Esnek Kutuları Düzen Oluşturma Resim 3 Apple - Bölüm 1 Gibi Bir Beş Esnek Kutuları Düzen Oluşturma Resim 4

laşık 10 22 soprano, sadece almak aşırı sağ kenarına tüm yol yüzden en az olan var 1024 kadar en maksimum diyelim Bu iki boyutları arasında 1440 grup için bu iki boyutları arasında Apple esnek bir düzen vardır bu yüzden nasıl size göstermek istiyorum ve daha sonra sabit bir düzen gider olmak biz bunu yapabilir Oldukça basit bazı temel HTML biraz CSS kullanarak şimdi ofis düzenleri HT çok basit olabilir efendim burada sayfa var asla Bu arada, bu yakalayabilir 0,5 esnek kutu düzeni sadece video gitmek tanı

m Mueller stil ve tüm bu eğlenceli kontrol etmek için bu sayfayı görünümü kaynağında açılır madde bu yüzden ben de go ahead ve ile başlamak kulüpler sayfa tarafından Benim üst kapsayıcı ve ben her zaman bir yapmak go ahead ve yapmak istiyorum Web sayfası her sayfa, bu ebeveyn kapsayıcı olmalı bu ne bizim ana kumanda olarak kullanmak için gidiyoruz Apple'ın 1024 hakkında az yapıyor gibi olan minimum ve maksimum ayarlamak için 1440 hakkında maksimum Şimdi bu içinde yapacağız üst ana kutu olan büyük bir kutu gerekecek büyük grafik ve biz gerçekten bizim ne Metnin ve sonra yapacağız beş küçük kutuları konum ve ben de devam ediyorum ve İlgilendiğiniz o promosyon kutuları diyor Bu ne olabilir gibi görünüyor, çünkü Apple'ın bu küçük dört kutu kullanarak başka var için yapıyor onlar öyle böyle şeyler taşımak sadece farklı ürünler biliyorum tanıtmak cilt içerdiği üst ve lider vergi navigasyon menüsü benim büyük kutu almak Tüm bu eğlenceli şeyler o kelimeyi geliyor düzeni Imgur promo kutuları için bu Bütün bu özel düzeni için HTML var gerçek iş tarzı değildir o kadar stil sayfası için nereye ilk şey ben yapmak istiyorum benim Ben varsayılan marj doldurma set nerede genç CSS sıfırlama kuralı ve bu 210 piksel sınırları onlar sadece google çevrimiçi bulabilirsiniz çok daha detaylı CS sıfırlama kuralları konum Son iktidar ASEAN aramak ama bu gerçekten hızlı, basit biridir Bu iyi çalışıyor ve bizim amacımız sadece iyi hizmet veren yani ne büyük bir kısmı içine almak istediğiniz bu kabı kontrol nasıl bu önemlidir, çünkü Bu web sayfası iç kap özelliği olacak seti yüzde yüz bir var olup ama biz 1440 piksel ile maksimum yapmak için Apple ne yaptığını var olduğunu gidiyoruz ve ayrıca 1024 piksel bir dakika yapacak böylece bu kaplar olacak onun genişletmek ve sözleşme olabilir esnek anlamına gelir ama o 1024 daha küçük olmayacak içinde 1.440 daha büyük olmayacak Cihaz 1024 küçükse biz altta olduğu yatay kaydırma olsun Ekranın tamam bu yüzden bizim temel esnek bir kap var sadece bu yüzden size burada sınırında ulusal çıkarlar açısından bu tür görebilirsiniz tek maya ekmek Jesse bunu kontrol edebilirsiniz alır Ben biraz bu germek eğer öyleyse biz aynı krom etrafında bu tasarruf Ben yükseklikleri yasal olması ve koymayın çünkü onu göremiyorum çemberler yükseklik ve onlar kadar biz sadece konum Bu yüksekliğe çalışmak bakın Şimdi, daha sonra dışarı almak için 500 piksel harcamak için gidiyoruz işte benim esnek boks size sadece can ancak CNN en beni yatay kaydırma veren sınırların olduğunu biraz erken bazıları da bu sadece biraz daha yapmak yapmak yüzde 98 gerçekçi yapılan değişiklikler uğursuz bir ayardır marjı resimlerinizi üst ve alt ve onun sol ve sağ çözüm konusunda artık sadece haber gazetecilere görmek hissediyorum Orada kenarda gitmek oldukça esnek görebilirsiniz bakın Burada oldukça iyi gidiyor ama boyutları bir kez tarayıcı biraz çok küçük 1024 minimum limitin altında Biz derste bunu Michael büyük tarayıcıda yatay kaydırma olsun sadece tarafında beyaz boşluğun miktarını artırır böylece web sitesi için esnek konteyner şimdi biz bu kritik adımı halledilir kazanılmış ettik Bir sonraki videoda büyük bir kutu izlerken promo boksörler üzerinde go ahead ve çalışacak Premier boksörler ve aşağı önce gizli kapı arasında bir sonraki kayda başlamak % uh Flickr Creative Commons ve ben can ağının bazı arka plan görüntüleri kapmak görsel malzeme için kullanmak.

Açıklama

Apple ve diğer birçok web siteleri dört küçük kutular altında o üstüne bir ana kutu ile basit ve serin, esnek düzeni kullanmak ve. Sitesi minimum ve maksimum genişlikleri ile esnektir. Bölüm 2: https://www.youtube.com/watch?v=ZFN9LjC6YUc Demo dosyası: http://www.sixminutessmarter.com/demofiles/webdev/five-flexible-boxes-layout.html divs yerine listeleri kullanarak demo: http://www.sixminutessmarter.com/demofiles/webdev/five-flexible-boxes-layout2.html

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

Ralph Phillips

Ralph Phillips

Üretkenlik yazılımları ve web geliştirme üzerinde durularak öğretici videolar. Web Geliştirme, HTML, CSS, JavaScript, PHP, Internet, SEO, Flash, Dreamweaver, Excel, Access, Word, PowerPoint, Web tabanlı uygulamalar ...

YORUMLAR



10/10

  • 18
    Olumlu
  • 0
    Olumsuz
  • 7
    Yorum
  • 4092
    Gösterim

SPONSOR VİDEO

Rastgele Yazarlar

  • Damian Winter

    Damian Winte

    27 ŞUBAT 2007
  • PhoneArena

    PhoneArena

    7 NİSAN 2006
  • UrAvgConsumer

    UrAvgConsume

    1 Ocak 2012

ANKET



Bu sayfa işinize yaradı mı?