Shu div-tegi orqali biz opshi saytimisning teppa yani style berish orqali biz width: 100% orqali eni 100% uzinlikka ega buladi.
Height: 650px orqali buyi shu uzinlikka ega bo’ladi.
background-image: linear-gradient(to right,#fe702e,#f84654);}
orqa fonga ikki xil rang beib olamiz 16lik sanoq sistemasida.
1.1-rasm
Shu kurishga taxlab olamiz va class=”bobosi”-deb berib olamiz.Bu tegning ichiga esha
Tegini yozib olamiz. Bu orqali biz nav tegini ichiga qolgan teglarimizni yozib olamiz:
AWESOME APP
Uy
Xususiyatlar
Narxlar
Yuklab oling
Awesome App Kompaniyasi mahsuloti
Ilovangizning xususiyatlarini, ekran rasmlarini namoyish qilish uchun ajoyib ochilish sahifasi shablonini, narxlar, foydalanuvchi guvohnomalari va yuklab olish havolalari.
Ilovangizni taqdim etish uchun ajoyib dizayn
To'liq javob beradi va Bootstrap & PaperKit tomonidan quvvatlanadi
Moslashtirish va sozlash juda oson
YUKLAB OLING
Nav-ni ichiga yozilgan kodlarni taxlil qiladigan bo’lsek div-tegi ni ichiga otasi degan class yozib olamiz. Chuniki class orqali biz kodimizga stil berishimiz oson bo’ladi. Div tegini ichiga yozgan kodimis orqali biz img tegini yozib olamiz va png rasm olib kelamiz.
1.2-rasm. Png rasm kelaldi.
AWESOME APP
Tegi orqili biz span tegini yozib ichiga AWESOME APP deb kompniniya nomini yozib olamiz. Va div- imizda yopib chiqib ketamiz.
Uy
Xususiyatlar
Narxlar
Yuklab oling
Bu ul tegini taxlil qiladigan bulsek. Ul va li teglarining vazifasi uzi spiska yani:
Uy
Xususiyatlar
Narxilar
Yuklab oling shunday kurinishga olib keladi.Bularga esa class berib olsek ul tegini class=”navbar” li teginiki esa calss=”nav”
O'zingizning ilovangiz haqida qisqacha hikoyani bu erga qo'shing, ilova qanday maqsadni hal qiladi va nima uchun sizning foydalanuvchingiz uni o'z qurilmalarida bo'lishini xohlaydi deb o'ylaysiz.
Quyida ularni ro'yxatlash orqali ilovangizning asosiy foydalanish holatini tiklang. Chap tomonga qayta tiklanadigan skrinshot qo'yganingizga ishonch hosil qiling.
Ilovangizni taqdim etish uchun ajoyib dizayn
To'liq javob beradi va Bootstrap & PaperKit tomonidan ishlaydi
Moslashtirish va sozlash juda oson
Bu teglarni vazifasinni yuqorida aytib o’tganiligim sababli aytilmaganlarni aytsam. Button kinopka vazifasini bajaradi.Still bersek.
.chiziq{
text-align: center;
margin: auto;
width: 85%;
opacity: 0.2;
}
.tel{
display: flex;
justify-content: center;
}
.telfon img{
padding: 20px;
margin-left: 7%;
width: 510px;
height: 464px;
}
.spancha{
font-size: 47px;
}
.yoz{
padding: 20px;
}
.yozu{
opacity: 0.7;
font-size: 20px;
}
.yozuv{
font-size: 20px;
opacity: 0.7;
}
Still berish orqali biz quyidagi kurinshga ega bo’lamiz.
1.6-rasm
Bizning skrinshotlarimizga qarang
Quyidagi ilovaning skrinshotlarini qo'shing. Qurilmaning haqiqiy maketlari ichiga qo'yib, ularni jonli qilishiga ishonch hosil qiling Ilovangizning skrinshotlarini tavsiflash uchun ushbu matnni almashtiring.
Bu teg kurinishi endi esa still kurinishni yozsek. Stil beish bootstaf fren vorklarini kopyuterga tortib olamiz. Va kopyuterga taylab yulini href orqali ko’rsatamiz.
Stilni kursatsek
.col{
background-color: #f5fafd;
width: 100%;
height: 900px;
text-align: center;
}
.spancha1{
font-size: 47px ;
}
.yozu1{
opacity: 0.7;
font-size: 20px;
}
Kurinishi esa quyidagi kurinishga ega bo’lamiz.
1.7-rasm
Siz uchun eng zo'r to'plamni oldik
Narxlar tuzilishini ko'rsatish uchun bo'lim. O'zingizning eng mashhur rejangizni quyida ko'rsatilgandek ta'kidlaganingizga ishonch hosil qiling. Narxlar rejangizni tavsiflash uchun ushbu matnni almashtiring.
Haqiqiy foydalanuvchi guvohnomalari - bu yangi mijozlarni jalb qilish va sizning ilovangizdan foydalanishga bo'lgan ishonchni oshirish uchun ajoyib usuldir. Quyidagi guvohnomalarni o'zingizning ilovangiz uchun bo'lganlar bilan almashtiring.
Awesome App ajoyib va men o'zimning loyihalarimda ishlashni tasavvur qila olmayman. Bu menga son-sanoqsiz vaqtni tejashga imkon berdi va samaradorlikni oshirdi.
