8 Temmuz 2015, ÇARŞAMBA

Basit Saf Css İlerleme Çubuğu

Bu video biz bir ilerleme çubuğu oluşturma olacak Biz CSS ekranda burada görebilirsiniz görmek istiyorum ve biz sadece bir an ona bir göz almaya gidiyoruz Bu kadar bina vardı hangi unsurlar, bizim göstermek amu sayı sadece zorlanma dalış ve Bilby henüz bunun için kod yazmak bu yüzden biz bu gibi dış kabuk dediğimiz burada görebilirsiniz alanı ve bu kendi içinde bir unsurudur ve sonra biz bu duygu içinde hangi başka Andaman olduğunu var ve bu hafta sonu yapılacak Önünüzde gidebilirsiniz ve sızıntının boyutunu denetlemek o burada Justin doldurmak için yapamam isterseniz ben bir sti

l aslında bu olmak zorunda an şimdi bu yararlıdır JavaScript ile bu kontrol ve ya da sadece dışarı üzerine koymak gitti bir veritabanından bu ödeme yapıyorsanız sayfaları ve sayı CSS ile daha iyi yapabileceğin

i mutlaka istemem yüzdesi yapmak ve bu durumda bir stil özelliklerine sahip mükemmel kabul edilebilir Ben kabul etti bunu değiştirmek ne zaman bir sinyal bu var o yine ben sadece seyretmek değil anima

“İki HTML elemanları ve bir kaç basit stilleri ile animasyonlu bir saf CSS ilerleme çubuğu oluşturma. Daha fazla öğreticiler için buraya Abone: http://www.youtube...”
Codecourse

syon ben bu CSS geçişleri kullanmak için bu sınıf kadar yiyorum uyanır çekin böylece hemen hemen o yapılandırılmış nasıl ve o gidelim nasıl çalıştığını önde Bunu yapmak çok basit gelgit doğruca dalış Evet devam edin ve dışarı başlatmak için bu yedi inşa Burada boş bir belge zaten bu taneli pirinç yemi yoksa ve biz de o sadece abdel CSS NIST denilen o burada bağlantılı bir yıldızı var Bu yaşayan CSS dizin stilleri hakkında yazılı edileceği Bu oran çubuğu gidiyor ç

Basit Saf Css İlerleme Çubuğu Resim 1 Basit Saf Css İlerleme Çubuğu Resim 2 Basit Saf Css İlerleme Çubuğu Resim 3 Basit Saf Css İlerleme Çubuğu Resim 4

ünkü orada ilk şey yapmak için çok yüzde yüz almak yerleştirilen herhangi bir kap var, içinde ben oluşturmak için gidiyorum Benim sayfa 2 rap Sınıf A rapçi için yaptım ve biz bu ilerleme çubuğu bakın eğer içeri isteyen sayfanızda herhangi bir yere yerleştirilebilir olacak sadece temelde bu yüzden içeriğini doldurmak için Diyelim ki sadece hızla bu stiller oluşturmak için diyelim için milli park ilerleme çubuğu ve 500 sivil sadece bir örnek Piksel rapçi şimdi biz istediğimiz şeydir sadece daha az bu yüzden oluşturmak i

çin gidiyorum biçimlendirme bakmak ilerleme çubuğunun sınıfı ile dev ve daha sonra burada içine Chris yayılma adlı İlerleme çubuğu Phil tarafının araba ile ilerleme Phil vardır Spam her adamlar başka üzerine aşağı NTT polisle sınıf ilerleme çubuğu kireç Sadece burada tutmak ders ya burada bir meanie metin değil göreceğiz tarafı şimdi bu var sayfadaki şey var, sadece biz etrafında oynayabilir onun işaretlemek zorunda Bu şimdi geliştirici araçları isterseniz bir takımından Stace go ahead ve dış kabuk başlayalım Bu ilerleme çubuğu saatler go ahead ve burada içine girebilirsiniz ilerleme ve yıldız demek diyor Biz üyelerinin de bir şekilde yüzde 100 kazanılır o sereceğim öyle bir kap vermek bu sahip olduğu yüzde 100 hissedebilirsiniz Bir backgroundcolors de bu kartlar tamamen size olan denetleyecek Biz örnek zenci gördüm sağ olanlar uygulaması Bu durumda güvenli, kolay sağ e0 e0 olduğunu olacak doldurma bu biraz verecektim rengi gri olmalı Dolgu Speedzone iki doldurunuz 783 piksel ve kenar sağa gidin bu kapsayıcı değil ve minivan border-radius: of Sınırları dışında yuvarlar 3 piksel gibi O sadece biz sadece temelde var ana bakın burada görebilirsiniz gri ve dikdörtgen ben border-radius delik sanırım: a üzerine Bu daha iyi ama yapabileceğimiz biraz bu yüzden biz kutu gölge ekleyebilirsiniz bir katil ilave ben onları gölge bile tarama ve sadece tabii etkinliğini dokunmayın bunu yapmak zorunda değilsiniz Emin yoksun görünüm giden bu yüzden biz bunu demek için gidiyor söylemek için ilave buraya azaltabilir bir kutu gölge olabilir Kuruluşundan bugün bir kullanmak için gidiyoruz x ekseni 1 piksel olduğu gibi ürkütücü piksel ve y-ekseni üzerinde üç resimler şeyler Bu gölge seçmek için pek çok yayılır sadece ne kadar olduğunu yaymak Bir UC RGBA fonksiyonları gibi kırmızı, yeşil mavi, bu durumda gölge kala alfa kanalı da Bütün bu yapmamızı sağlar c0 00 olduğunu bazı etkiye sahip teklif kanalları için size blok ve nokta Ben güvenle biz bu güzel var demek olabilir yenilemek zaman şimdi burada göremiyor ve ilave bunun biraz görünmesini sağlar şeyler arıyor daha gerçekten çok hissediyorum Şimdi bu ilerleme çubuğu Phil odaklanmak için gidiyoruz açıklıklı şimdi ben neden bu bir yayılma nedeni olduğunu yaratır değil gerçek Andaman biz Sopore için harekete ilerleme çubuğunu kazandı ve ben sayfada kulüpler Inspiron sığır yapabilirsiniz bir yayılma seçti sadece gerçekten alakalı değil değil Hatta eğer gerçekten istiyorsanız bu bir bir antipodean vermek bu nedenle bu ilerleme demek hissediyorum gördüm Şimdi ben öylece onun bir yirmi iki piksel vereceğim bu yüzden bir yüksekliğe vermek Meeks Eğer en de bu bir arka plan rengi vereyim istersen yeni Bu arka plan rengi 6 var bırakacağım Aynıdır 5 dokuz CE F oldukça güzel mavi renk mavi eşek peygamberçiçeği Güvenlik denetimi bu iyi bakıyor nasıl biz aslında şu anda görebilirsiniz Sebebi Bu baba bir görüntü bloğu kalmamasıdır display: block kendi yayılma ben yenilemek zaman o görebilirsiniz sırf var Bu Foo cezaevinde içerdiği tüm doldurulur am Biz biz neler yapabileceğini olarak birlikte önceden tanımlanmış yok biz her zaman bu hafta 20 inç ya da öylesine yıldızı verebilir başlamak ama bir konuda bu ya diyerek stil tarafından kontrol zaman eşittir ve CSS olmayan tanımlayan ya da yüzde veren ama dediğim gibi önce muhtemelen olmaz CSS en iyi muhtemelen javascript kontrolünü kullanarak çünkü bu sadece edeceğiz Sebago içinde yüzde 30 besbelli sayfaya koyarak dışarı bu sadece var Bize verecek ve burada ac tam yüzdesi burada 100 sandviç var çünkü Bir ama şimdi Sadece bu yüzden söylemek sınırına ekleyerek bir göz atalım Üç piksel yarıçapı dışında border-radius maç: Böyle biraz daha sitedeki kenarları mermi olarak biraz daha güzel görünüyor ve son olarak bir saat tranzisyonda bu yüzden bu hafta değiştirirseniz mim altmış demek ya da sadece düz kadar atlar ne olursa olsun Sen Eğer sürekli değerini güncelliyoruz ise Eğer sadece makin animasyon biraz eklemek isteyebilirsiniz küçük bir metin beni çok bir geçiş kaçırmak Bu bahsedilen yolda geçiş içine amatör için bize izin verir ve temelde s geçiş istediğinizde değişikliklerle demek şimdi beş son animasyon alıntı böylece bizim millet özelliğini seçin yüz milisaniye bu herhangi bir şey olabilir olmak istediğin wan eğer bir saniye var bir ben beş yüz milisaniye iş bulmuş güzelce Beni geçiş türü kolaylığı tercih out sen onu şimdi kolay olmalı istediğiniz her şeyi olabilir Eğer tamamen size kolay düşünmek tarafından LINEAS olabilir ilerleme için dışarı bar oldukça güzel değil Sadece bu geçişi test edilir yapılan yıldızlı yan hafta o yüzden görebilmek için Javascript yeni sabit yük ile bir dosyayı karşıya diyelim Bu yüzdelik değer Gelecek elli Bunu güzel animasyon görebilirsiniz Ben 200 şimdi var çünkü ve güzel animasyonlu ilerleme çubuğu CSS ile.

Açıklama

İki HTML elemanları ve bir kaç basit stilleri ile animasyonlu bir saf CSS ilerleme çubuğu oluşturma. Daha fazla öğreticiler için buraya Abone: http://www.youtube.com/subscription_center?add_user=phpacademy Kanalımız http://youtube.com/phpacademy Resmi internet sitesi http://phpacademy.org Destek Forumu http://phpacademy.org/forum Bizi Twitter'da takip edin! http://twitter.com/phpacademy

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

Codecourse

Codecourse

Ücretsiz kod öğrenmek yardımcı olmak. Nerede olduğunu merak olsaydı biz resmen phpacademy olarak biliniyordu. Sorular, yorum veya geribildirim? Biz sizden duymak istiyorum! Hello@codecourse.com için bize e-posta Bırak

YORUMLAR



10/10

  • 152
    Olumlu
  • 0
    Olumsuz
  • 17
    Yorum
  • 5352
    Gösterim

SPONSOR VİDEO

Rastgele Yazarlar

  • AmazonWireless

    AmazonWirele

    8 EYLÜL 2010
  • L33TNoonProductions

    L33TNoonProd

    24 EYLÜL 2010
  • MisterBrightside

    MisterBright

    24 Mart 2006

ANKET



Bu sayfa işinize yaradı mı?