Sütunu Divi ile bir fiyat paketine dönüştürmek
Divi’nin yeni sütun seçeneği, iş akışımıza birçok yeni tasarım sundu. Tek bir CSS koduna dokunmak zorunda kalmadan çeşitli modüllerin birleştirilmesine yardımcı oldular. Bu yazıda, Divi varsayılan seçeneğini kullanarak sütunu bir fiyat paketine dönüştüreceğiz. Ayrıca bazı şaşırtıcı Hover efektlerini elde etmek için Hover Sütun Dönüşümü seçeneğiyle de oynayacağız. JSON’u ücretsiz olarak da indirebilirsiniz! Haydi Yapalım şunu. Önizleme Öğreticiyi girmeden önce sonuçlara çeşitli ekran boyutlarında bakalım. Masaüstü
Hücresel Ücretsiz sütun fiyat paketi düzeni almak için ücretsiz sütun fiyat paketinin düzenini indirin, önce aşağıdaki düğmeyi kullanarak indirmeniz gerekir. İndirmelere erişmek için, aşağıdaki formu kullanarak Divi Daily E -posta listemize abone olmanız gerekir. Yeni bir müşteri olarak, her Pazartesi daha fazla Divi’nin iyi ve ücretsiz Divi düzen paketleri alacaksınız! Zaten listede iseniz, e -posta adresinizi aşağıya girin ve İndir’i tıklayın. “Abone olmayacak” veya ek e -postalar almayacaksınız.Dosyayı indir
Divi bültenine katılmak için ücretsiz indirin ve en iyi divi düzen paketinin kopyasına bir e -posta göndereceğiz, ayrıca birçok kaynak, ipucu ve olağanüstü ve ücretsiz divi hileleri. Takip et ve kısa sürede bir divi ustası olacaksınız. Abone olduysanız, e -posta adresinizi aşağıya yazın ve Düzen Paketine erişmek için İndir’i tıklayın.
Abone olmayı başardınız. Aboneliğinizi onaylamak için lütfen e -posta adresinizi kontrol edin ve Ücretsiz Haftalık Divi Düzen Paketine erişin! Yaratıcı başlayalım! YouTube kanalına abone Olgunun arka planının yeni bir bölümünü ekliyoruz, üzerinde çalıştığınız sayfaya yeni normal bölümü ekleyin ve bölümün ayarlarını açın. Arka plan ayarını açın ve doğrusal gradyanın arka planını ekleyin:
Renk 1: #eded
Renk 2: #ffffff
Başlangıç Pozisyonu:% 30
Son pozisyon:% 30
Mesafemiz ayrıca bu bölüme birkaç üst ve alt ped ekledi. Üst dolgu: 200px
Dolgu Alt: 200px
Sütun yapısının yeni bir satırı ekleyin. Aşağıdaki sütun yapısını kullanarak bölüme yeni bir satır ekleyerek devam edin: Herhangi bir modül eklemeden yapıştırıcı, satır ayarlarını açın, devam eden sekmeyi açın ve uygun boyut ayarlarını değiştirin: Özel Talang genişliği kullanın: evet
Talang genişliği: 1
Genişlik:% 80 (masaüstü ve tablet),% 90 (telefon)
Maksimum genişlik: 1400px (masaüstü),% 90 (tablet),% 100 (cep telefonu)
Sütun 1 Ayarları İlkden başlayarak sütun ayarlarını da değiştirmemiz gerekir. Sütun Ayarları 1’i açın. Gradyan Arka Plan Sütun 1’e aşağıdaki gradyan arka planını uygulayın: Renk 1: #F7F7F7
Renk 2: #ffffff
Gradyan Türü: Radyal
Radyal yön: aşağıda
Başlangıç Pozisyonu:% 31
Son pozisyon:% 31
Sınırlama ’20px’ sınır yarıçapını sütuna da ekleyin. Kutunun gölgesi ve sayfada biraz derinlik elde etmek için, pürüzsüz bir kutu gölgesi de ekleyeceğiz. Bulanık Güç Gölgesi Kutusu: 80px
Gölge Rengi: RGBA (0.0,0,0.11)
Varsayılan Dönüşüm Ölçeği Bu yayının önizlemesinde görebileceğiniz gibi, sütun biraz değişir. Dönüşüm ayarlarını açın ve Dönüşüm Ölçeği seçeneğinin varsayılan durumda ‘%100’ sabit olduğundan emin olun. Kırık:%100 Doğru:% 100
Dönüşüm Ölçeğini Yönlendirin İmleci yönlendirirken dönüşüm ölçeği değerini değiştirin.
Aşağıda:% 120 Doğru:% 120
Varsayılan dönüşüm çevirimiz ayrıca çeviri dönüşüm ayarlarını kullanarak masaüstünde sağa hafif bir sütun itti. Aşağıdaki girişi ekleyin:
Aşağıda: 34 piksel (masaüstü), 0px (tablet ve cep telefonu) Doğru: 0px
Tercüme Dönüşümünü Yönlendirin İmleci yönlendirirken dönüşüm değerini normale döndürür.
Aşağıda: 0px Doğru: 0px
Durne Varsayılan dönüşüm dönüşüm dönüş ayarlarına geçer ve aşağıdaki değeri sola ekler:
Sol: 352deg (masaüstü), 0deg (tablet ve cep telefonu) İmleçi yönlendirirken değeri ‘0deg’ olarak döndürmek için dönüşün dönüşümünü yönlendirin.
Sol: 0deg Taşma Bu yayının ilerleyen saatlerinde, sütunun altına bir düğme ekleyeceğiz. Düğme, sütunun alt sınırı ile örtüşecektir. Buna izin vermek için sütun taşımızı görünür hale getirmemiz gerekir.
Yatay taşma: görünür Dikey taşma: görünür
Z Varsayılan dizin, z sütunu dizinini sonraki çeşitli ekran boyutlarında değiştirir. Bu, düzenlemeyi düzenli olarak tutmamıza yardımcı olacaktır.
Dizin Z: 9 (masaüstü), 11 (tablet ve cep telefonu) İmleçi yönlendirirken z index’e giderken, sütunun diğerlerinin üzerinde görünmesini istiyoruz. Bunun gerçekleşmesi için imleci yönlendirirken Z indeksini artıracağız.
Dizin Z: 11 Geçişimiz ayrıca geçiş düzenlemesindeki geçiş süresini artırarak düzgün bir geçiş yapar.
Geçiş süresi: 500ms Sütun 2’yi ikinci sütuna ayarlayın! Lütfen ve sütun ayarlarını açın.
Renk 1: #FFF200 Renk 2: #ffffff Gradyan Türü: Radyal
Radyal yön: aşağıda
Başlangıç Pozisyonu:% 31
Son pozisyon:% 31
Sınırlama ’20px’ bir sonraki sınır yarıçapını ekleyin.
Pürüzsüz kutunun gölgesiyle birlikte kutunun gölgesi.
Bulanık Güç Gölgesi Kutusu: 50px Gölge Rengi: RGBA (0.0,0,0.14) İkinci sütun varsayılan dönüşüm ölçeği amiral gemisi fiyat paketimizdir. Bunun dikkatden kaçmamasını sağlamak için, Dönüşüm Ölçeği ayarındaki sütunun boyutunu artıracağız.
Aşağıda:% 112 (masaüstü),% 100 (tablet ve cep telefonu)
Sağ:% 112 (masaüstü),% 100 (tablet ve cep telefonu) Dönüşüm Ölçeğini Yönlendirin İmleci yönlendirirken dönüşüm ölçeği değerini değiştirin.
Aşağıda:% 120
Doğru:% 120 Taşma bir sonraki yatay ve dikey taşmayı değiştirin.
Yatay taşma: görünür
Dikey taşma: görünür Varsayılan z ineksi daha sonra, görünürlük ayarlarını açın ve Z sütun dizinini artırın.
Dizin Z: 10
İmleçi yönlendirirken doğrudan dizin z değiştirme dizini değiştirin. Dizin Z: 12
Geçiş ve geçiş regülasyonunda geçiş süresini arttırın. Geçiş süresi: 500ms
Sütun 3’ü üçüncü ve son sütuna ayarlayın! Sütun ayarlarını açın. Gradyan Arka Plan Arka plan ayarını açın ve aşağıdaki gradyan arka planını ekleyin:
Renk 1: #F7F7F7 Renk 2: #ffffff Gradyan Türü: Radyal
Radyal yön: aşağıda
Başlangıç Pozisyonu:% 31
Son pozisyon:% 31
Sınır ’20px’ sınırının bir sonraki yarıçapını ekleyin.
Pürüzsüz bir kutunun gölgesiyle birlikte kutunun gölgesi.
Bulanık Güç Gölgesi Kutusu: 80px Gölge Rengi: RGBA (0.0,0,0.11) Varsayılan dönüşüm ölçeği, sütunu değiştirmenin zamanıdır! Varsayılan dönüşüm ölçeği değerinin ‘%100’ sabit olduğundan emin olun. Aşağıda:%100
Doğru:% 100
Dönüşüm Ölçeğini Yönlendirin İmleci yönlendirirken bu değerleri değiştirin. Aşağıda:% 120
Doğru:% 120
Varsayılan dönüşüm çevirimiz ayrıca bazı özel dönüşüm dönüşüm değerleri uygulayarak sütunu masaüstünde sola itti. Aşağıda: -34px (masaüstü), 0px (tablet ve cep telefonu)
Doğru: 0px
İmleçi yönlendirirken çevirilerin dönüşümünü yönlendirir. Aşağıda: 0px
Doğru: 0px
Varsayılan durumdaki sütunu çevirerek varsayılan dönüşüm devam edin. Sol: 8 derece (masaüstü), 0 derece (tablet ve cep telefonu)
Doğrudan Dönüşüm Oyunu Sol dönüşümün değerini imleci yönlendirirken ‘0px’ olarak değiştirin.
Sol: 0deg Taşma Bir sonraki taşmanın göründüğünden emin olun.
Yatay taşma: görünür Dikey taşma: görünür
Varsayılan z ineksi daha sonra, görünürlük ayarlarını açın ve varsayılan z indexinin 9 olduğundan emin olun. Dizin Z: 9
İmleçi yönlendirirken doğrudan dizin z değiştirme dizini değiştirin.
Dizin Z: 11 Geçiş ve geçiş regülasyonunda geçiş süresini arttırın.
Geçiş süresi: 500ms Blurb Modülünü Sütun 1’e Ekleyin Başlık ekleyin Modülü ilk sütuna eklemeye başlar! Yeni bir bulanıklık modülü ekleyin ve başlığı girin.
Simgeyi seçin Bir sonraki simgeyi seçin. Simgeyi ayarlama Tasarım sekmesine geçer ve uygun simge ayarlarını değiştirin:
Renk simgesi: #000000 Simge Yerleştirme: Üst Simge yazı tipi boyutu kullanın: evet Ikon yazı tipi boyutu: 50px
Başlık Ayarları Metin Ayarlarını Değiştirin Sonraki Başlık.
Yazı Tip Başlığı: Poppins
Hizalama Metin Başlığı: Orta
Başlık Metin Rengi: #000000 Başlık Metin Boyutu: 27px
Mesafe ve bazı üst kenar boşlukları da ekleyin.
Bölme modülünü Sütun 1 görünürlüğüne ikinci modül olan bölücü modülüne ekleyin. ‘Ekran göster’ seçeneğinin etkinleştirildiğinden emin olun.
Divisor göster: evet
Çizgi tasarım sekmesine geçer ve bölücünün rengini siyah olarak değiştirir. Çizgi rengi: #000000
Yapıştırıcı değişim de boyutu ayarlayın. Bölücü ağırlığı: 6px
Genişlik:% 14 Modül hizalaması: merkez
Yükseklik: 0px Son mesafe, bazı üst kenar boşlukları ekleyin.
Üst kenar boşluğu: 50 piksel
Sütun 1’e Metin Modülü #1 ekleyin Dolgu Ekle Ekle Metin modülünü bölücü modülünün hemen altına ekleyerek devam edin ve istediğiniz içerikten bazılarını girin.
Metin Ayarları Tasarım sekmesine geçin ve uygun metin ayarlarını değiştirin:
Metin Yazı Tipi: Poppins Metin yazı tipi ağırlığı: ışık
Hizalama Metni: Orta Metin Rengi: #4F4F4F Yüksek çizgi metin: 2.3em
Mesafe Bazı özel kenar boşlukları ve dolgu değerleri de ekleyin.
Üst kenar boşluğu: 50 piksel
Üst dolgu: 10 piksel
Dolgu Alt: 10 piksel
Metin Modülü #2 ekleyin Sütun 1 için içeriği ekleyin Önceki metin modülünün hemen altına ekleyin, başka bir metin modülüne ihtiyacımız var. İstediğiniz bazı içerikleri girin. Metin Ayarları Tasarım sekmesine geçin ve uygun metin ayarlarını değiştirin:
Metin Yazı Tipi: Poppins
Metin yazı tipi: Ağırlık
Hizalama Metni: Orta Metin rengi: #000000 Metin Boyutu: 47px
Hat yüksekliği metni: 1em
Mesafe Biraz üst ve alt kenar boşlukları da ekleyin.
Üst kenar boşluğu: 50 piksel
Alt kenar boşluğu: 80 piksel
Düğme modülünü Sütun 1’e ekleyin Bir sonraki bölümün bir kopyasını ekleyin ve son olarak 1 sütundaki ihtiyacımız olan düğme modülüdür. Seçtiğiniz bazı kopyaları girin.
Hizalama Tasarım sekmesini açın ve düğmenin ortasına hizalanmasını değiştirin. Düğmenin hizalanması: orta
Stil düğmesini de ayarlayın.
Düğme için özel bir stil kullanın: Evet metin düğmesinin boyutu: 17px Metin Renk Düğmesi: #000000 Arka plan renk düğmesi: #ffffff
Düğmenin sınır genişliği: 0px Yarıçap düğmesi sınırı: 100 piksel
Yazı tipi düğmesi: Poppins
Mektup Ağırlığı Düğmesi: Kalın
Mesafemiz ayrıca bazı marj değerleri ve özel dolgu ekleyecektir.
Üst kenar boşluğu: 50 piksel
Alt kenar boşluğu: -40px
Üst dolgu: 23px
Dolgu Alt: 23px
Sol dolgu: 70px Sağ dolgu: 70px
Kutunun gölgesi ve pürüzsüz kutu gölgesinin pürüzsüz düğmesini vererek tamamlayacağız.
Bulanık Güç Gölgesi Kutusu: 50px
Gölge Rengi: RGBA (0.0,0,0,3)
Tüm modülleri iki kez klonlar ve geri kalan sütuna yinelendirir ve sütun 1’deki tüm modülleri bitirdikten sonra, iki kez klonlayabilir ve kopyayı kalan iki sıra sütuna koyabilirsiniz.
Blurb Icon ve Başlıkını Değiştirin Her bir kopya için açıklamanın simgesini ve başlığını değiştirdiğinizden emin olun.
Metin modülü içeriğini metin modülünün içeriği ile değiştirin. #2 son fakat en az değil düğmesini değiştirin, sütun 2’deki düğmeyi açın ve düğme ayarlarını değiştirin. Bu adımı bitirdikten sonra bitirdiniz!
Metin Renk Düğmesi: #fffffff
Arka Plan Renk Düğmesi: #8300E9 Önizleme Şimdi tüm adımlardan geçtikten sonra, çeşitli ekran boyutlarındaki nihai sonuçlara bakalım. Masaüstü Hücresel
Abone olmayı başardınız. Aboneliğinizi onaylamak için lütfen e -posta adresinizi kontrol edin ve Ücretsiz Haftalık Divi Düzen Paketine erişin! Yaratıcı başlayalım! YouTube kanalına abone Olgunun arka planının yeni bir bölümünü ekliyoruz, üzerinde çalıştığınız sayfaya yeni normal bölümü ekleyin ve bölümün ayarlarını açın. Arka plan ayarını açın ve doğrusal gradyanın arka planını ekleyin:
Renk 1: #eded
Renk 2: #ffffff
Başlangıç Pozisyonu:% 30
Son pozisyon:% 30
Mesafemiz ayrıca bu bölüme birkaç üst ve alt ped ekledi. Üst dolgu: 200px
Dolgu Alt: 200px
Sütun yapısının yeni bir satırı ekleyin. Aşağıdaki sütun yapısını kullanarak bölüme yeni bir satır ekleyerek devam edin: Herhangi bir modül eklemeden yapıştırıcı, satır ayarlarını açın, devam eden sekmeyi açın ve uygun boyut ayarlarını değiştirin: Özel Talang genişliği kullanın: evet
Talang genişliği: 1
Genişlik:% 80 (masaüstü ve tablet),% 90 (telefon)
Maksimum genişlik: 1400px (masaüstü),% 90 (tablet),% 100 (cep telefonu)
Sütun 1 Ayarları İlkden başlayarak sütun ayarlarını da değiştirmemiz gerekir. Sütun Ayarları 1’i açın. Gradyan Arka Plan Sütun 1’e aşağıdaki gradyan arka planını uygulayın: Renk 1: #F7F7F7
Renk 2: #ffffff
Gradyan Türü: Radyal
Radyal yön: aşağıda
Başlangıç Pozisyonu:% 31
Son pozisyon:% 31
Sınırlama ’20px’ sınır yarıçapını sütuna da ekleyin. Kutunun gölgesi ve sayfada biraz derinlik elde etmek için, pürüzsüz bir kutu gölgesi de ekleyeceğiz. Bulanık Güç Gölgesi Kutusu: 80px
Gölge Rengi: RGBA (0.0,0,0.11)
Varsayılan Dönüşüm Ölçeği Bu yayının önizlemesinde görebileceğiniz gibi, sütun biraz değişir. Dönüşüm ayarlarını açın ve Dönüşüm Ölçeği seçeneğinin varsayılan durumda ‘%100’ sabit olduğundan emin olun. Kırık:%100 Doğru:% 100
Dönüşüm Ölçeğini Yönlendirin İmleci yönlendirirken dönüşüm ölçeği değerini değiştirin.
Aşağıda:% 120 Doğru:% 120
Varsayılan dönüşüm çevirimiz ayrıca çeviri dönüşüm ayarlarını kullanarak masaüstünde sağa hafif bir sütun itti. Aşağıdaki girişi ekleyin:
Aşağıda: 34 piksel (masaüstü), 0px (tablet ve cep telefonu) Doğru: 0px
Tercüme Dönüşümünü Yönlendirin İmleci yönlendirirken dönüşüm değerini normale döndürür.
Aşağıda: 0px Doğru: 0px
Durne Varsayılan dönüşüm dönüşüm dönüş ayarlarına geçer ve aşağıdaki değeri sola ekler:
Sol: 352deg (masaüstü), 0deg (tablet ve cep telefonu) İmleçi yönlendirirken değeri ‘0deg’ olarak döndürmek için dönüşün dönüşümünü yönlendirin.
Sol: 0deg Taşma Bu yayının ilerleyen saatlerinde, sütunun altına bir düğme ekleyeceğiz. Düğme, sütunun alt sınırı ile örtüşecektir. Buna izin vermek için sütun taşımızı görünür hale getirmemiz gerekir.
Yatay taşma: görünür Dikey taşma: görünür
Z Varsayılan dizin, z sütunu dizinini sonraki çeşitli ekran boyutlarında değiştirir. Bu, düzenlemeyi düzenli olarak tutmamıza yardımcı olacaktır.
Dizin Z: 9 (masaüstü), 11 (tablet ve cep telefonu) İmleçi yönlendirirken z index’e giderken, sütunun diğerlerinin üzerinde görünmesini istiyoruz. Bunun gerçekleşmesi için imleci yönlendirirken Z indeksini artıracağız.
Dizin Z: 11 Geçişimiz ayrıca geçiş düzenlemesindeki geçiş süresini artırarak düzgün bir geçiş yapar.
Geçiş süresi: 500ms Sütun 2’yi ikinci sütuna ayarlayın! Lütfen ve sütun ayarlarını açın.
Renk 1: #FFF200 Renk 2: #ffffff Gradyan Türü: Radyal
Radyal yön: aşağıda
Başlangıç Pozisyonu:% 31
Son pozisyon:% 31
Sınırlama ’20px’ bir sonraki sınır yarıçapını ekleyin.
Pürüzsüz kutunun gölgesiyle birlikte kutunun gölgesi.
Bulanık Güç Gölgesi Kutusu: 50px Gölge Rengi: RGBA (0.0,0,0.14) İkinci sütun varsayılan dönüşüm ölçeği amiral gemisi fiyat paketimizdir. Bunun dikkatden kaçmamasını sağlamak için, Dönüşüm Ölçeği ayarındaki sütunun boyutunu artıracağız.
Aşağıda:% 112 (masaüstü),% 100 (tablet ve cep telefonu)
Sağ:% 112 (masaüstü),% 100 (tablet ve cep telefonu) Dönüşüm Ölçeğini Yönlendirin İmleci yönlendirirken dönüşüm ölçeği değerini değiştirin.
Aşağıda:% 120
Doğru:% 120 Taşma bir sonraki yatay ve dikey taşmayı değiştirin.
Yatay taşma: görünür
Dikey taşma: görünür Varsayılan z ineksi daha sonra, görünürlük ayarlarını açın ve Z sütun dizinini artırın.
Dizin Z: 10
İmleçi yönlendirirken doğrudan dizin z değiştirme dizini değiştirin. Dizin Z: 12
Geçiş ve geçiş regülasyonunda geçiş süresini arttırın. Geçiş süresi: 500ms
Sütun 3’ü üçüncü ve son sütuna ayarlayın! Sütun ayarlarını açın. Gradyan Arka Plan Arka plan ayarını açın ve aşağıdaki gradyan arka planını ekleyin:
Renk 1: #F7F7F7 Renk 2: #ffffff Gradyan Türü: Radyal
Radyal yön: aşağıda
Başlangıç Pozisyonu:% 31
Son pozisyon:% 31
Sınır ’20px’ sınırının bir sonraki yarıçapını ekleyin.
Pürüzsüz bir kutunun gölgesiyle birlikte kutunun gölgesi.
Bulanık Güç Gölgesi Kutusu: 80px Gölge Rengi: RGBA (0.0,0,0.11) Varsayılan dönüşüm ölçeği, sütunu değiştirmenin zamanıdır! Varsayılan dönüşüm ölçeği değerinin ‘%100’ sabit olduğundan emin olun. Aşağıda:%100
Doğru:% 100
Dönüşüm Ölçeğini Yönlendirin İmleci yönlendirirken bu değerleri değiştirin. Aşağıda:% 120
Doğru:% 120
Varsayılan dönüşüm çevirimiz ayrıca bazı özel dönüşüm dönüşüm değerleri uygulayarak sütunu masaüstünde sola itti. Aşağıda: -34px (masaüstü), 0px (tablet ve cep telefonu)
Doğru: 0px
İmleçi yönlendirirken çevirilerin dönüşümünü yönlendirir. Aşağıda: 0px
Doğru: 0px
Varsayılan durumdaki sütunu çevirerek varsayılan dönüşüm devam edin. Sol: 8 derece (masaüstü), 0 derece (tablet ve cep telefonu)
Doğrudan Dönüşüm Oyunu Sol dönüşümün değerini imleci yönlendirirken ‘0px’ olarak değiştirin.
Sol: 0deg Taşma Bir sonraki taşmanın göründüğünden emin olun.
Yatay taşma: görünür Dikey taşma: görünür
Varsayılan z ineksi daha sonra, görünürlük ayarlarını açın ve varsayılan z indexinin 9 olduğundan emin olun. Dizin Z: 9
İmleçi yönlendirirken doğrudan dizin z değiştirme dizini değiştirin.
Dizin Z: 11 Geçiş ve geçiş regülasyonunda geçiş süresini arttırın.
Geçiş süresi: 500ms Blurb Modülünü Sütun 1’e Ekleyin Başlık ekleyin Modülü ilk sütuna eklemeye başlar! Yeni bir bulanıklık modülü ekleyin ve başlığı girin.
Simgeyi seçin Bir sonraki simgeyi seçin. Simgeyi ayarlama Tasarım sekmesine geçer ve uygun simge ayarlarını değiştirin:
Renk simgesi: #000000 Simge Yerleştirme: Üst Simge yazı tipi boyutu kullanın: evet Ikon yazı tipi boyutu: 50px
Başlık Ayarları Metin Ayarlarını Değiştirin Sonraki Başlık.
Yazı Tip Başlığı: Poppins
Hizalama Metin Başlığı: Orta
Başlık Metin Rengi: #000000 Başlık Metin Boyutu: 27px
Mesafe ve bazı üst kenar boşlukları da ekleyin.
Bölme modülünü Sütun 1 görünürlüğüne ikinci modül olan bölücü modülüne ekleyin. ‘Ekran göster’ seçeneğinin etkinleştirildiğinden emin olun.
Divisor göster: evet
Çizgi tasarım sekmesine geçer ve bölücünün rengini siyah olarak değiştirir. Çizgi rengi: #000000
Yapıştırıcı değişim de boyutu ayarlayın. Bölücü ağırlığı: 6px
Genişlik:% 14 Modül hizalaması: merkez
Yükseklik: 0px Son mesafe, bazı üst kenar boşlukları ekleyin.
Üst kenar boşluğu: 50 piksel
Sütun 1’e Metin Modülü #1 ekleyin Dolgu Ekle Ekle Metin modülünü bölücü modülünün hemen altına ekleyerek devam edin ve istediğiniz içerikten bazılarını girin.
Metin Ayarları Tasarım sekmesine geçin ve uygun metin ayarlarını değiştirin:
Metin Yazı Tipi: Poppins Metin yazı tipi ağırlığı: ışık
Hizalama Metni: Orta Metin Rengi: #4F4F4F Yüksek çizgi metin: 2.3em
Mesafe Bazı özel kenar boşlukları ve dolgu değerleri de ekleyin.
Üst kenar boşluğu: 50 piksel
Üst dolgu: 10 piksel
Dolgu Alt: 10 piksel
Metin Modülü #2 ekleyin Sütun 1 için içeriği ekleyin Önceki metin modülünün hemen altına ekleyin, başka bir metin modülüne ihtiyacımız var. İstediğiniz bazı içerikleri girin. Metin Ayarları Tasarım sekmesine geçin ve uygun metin ayarlarını değiştirin:
Metin Yazı Tipi: Poppins
Metin yazı tipi: Ağırlık
Hizalama Metni: Orta Metin rengi: #000000 Metin Boyutu: 47px
Hat yüksekliği metni: 1em
Mesafe Biraz üst ve alt kenar boşlukları da ekleyin.
Üst kenar boşluğu: 50 piksel
Alt kenar boşluğu: 80 piksel
Düğme modülünü Sütun 1’e ekleyin Bir sonraki bölümün bir kopyasını ekleyin ve son olarak 1 sütundaki ihtiyacımız olan düğme modülüdür. Seçtiğiniz bazı kopyaları girin.
Hizalama Tasarım sekmesini açın ve düğmenin ortasına hizalanmasını değiştirin. Düğmenin hizalanması: orta
Stil düğmesini de ayarlayın.
Düğme için özel bir stil kullanın: Evet metin düğmesinin boyutu: 17px Metin Renk Düğmesi: #000000 Arka plan renk düğmesi: #ffffff
Düğmenin sınır genişliği: 0px Yarıçap düğmesi sınırı: 100 piksel
Yazı tipi düğmesi: Poppins
Mektup Ağırlığı Düğmesi: Kalın
Mesafemiz ayrıca bazı marj değerleri ve özel dolgu ekleyecektir.
Üst kenar boşluğu: 50 piksel
Alt kenar boşluğu: -40px
Üst dolgu: 23px
Dolgu Alt: 23px
Sol dolgu: 70px Sağ dolgu: 70px
Kutunun gölgesi ve pürüzsüz kutu gölgesinin pürüzsüz düğmesini vererek tamamlayacağız.
Bulanık Güç Gölgesi Kutusu: 50px
Gölge Rengi: RGBA (0.0,0,0,3)
Tüm modülleri iki kez klonlar ve geri kalan sütuna yinelendirir ve sütun 1’deki tüm modülleri bitirdikten sonra, iki kez klonlayabilir ve kopyayı kalan iki sıra sütuna koyabilirsiniz.
Blurb Icon ve Başlıkını Değiştirin Her bir kopya için açıklamanın simgesini ve başlığını değiştirdiğinizden emin olun.
Metin modülü içeriğini metin modülünün içeriği ile değiştirin. #2 son fakat en az değil düğmesini değiştirin, sütun 2’deki düğmeyi açın ve düğme ayarlarını değiştirin. Bu adımı bitirdikten sonra bitirdiniz!
Metin Renk Düğmesi: #fffffff
Arka Plan Renk Düğmesi: #8300E9 Önizleme Şimdi tüm adımlardan geçtikten sonra, çeşitli ekran boyutlarındaki nihai sonuçlara bakalım. Masaüstü Hücresel
