Ин аст, ки чӣ тавр илова кардани тасвирҳои ҷавобии лоиҳавӣ бо CSS
Дар вебсайтҳои машҳури имрӯза ва як тарҳи тарҳрезӣ, ки шумо боварӣ доред, ки тасвирҳои калон, экрани сафедаро мебинед. Яке аз проблемаҳо бо илова кардани ин тасвирҳо аз таҷрибаи беҳтарин, ки вебсайтҳо бояд ба андозаи экран ва дастгоҳҳои гуногун ҷавобгӯ бошанд - усули тарҳрезии вебсафҳаро ҳамчун маъруф шинохта.
Азбаски таркиби вебсайтии шумо тағйирёбанда ва миқёсро бо андозаи гуногуни экрани тағйир медиҳад, инҳо низ бояд ин тасвирҳои аслиро андозаи худро андоза кунанд.
Дар асл, ин «тасвирҳои собит» яке аз қисмҳои асосии вебсайтҳои ҷавобӣ мебошанд (дар якҷоягӣ бо шабакаи моеъӣ ва саволномаҳои ВАО). Ин се қисм аз оғози тарҳрезии вебсафҳаи оддии веб сохта шуда буд, аммо дар ҳоле ки он ҳамеша ба осонӣ барои тасвирҳои интернетие, ки ба сайт ҷой дода шудааст, тасвир карда шудааст (тасвирҳои собит ин графикҳое мебошанд, ки ҳамчун қисмати HTML нишон дода шудаанд), Ҳамзамон бо тасвирҳои аслӣ (ки бо истифода аз объектҳои асосии CSS дар саҳифа сабт карда шудаанд) муддати тӯлонӣ барои бисёре аз дизайнерҳои интернетӣ ва таҳиякунандагони охирин мушкилоти ҷиддӣ пешкаш намуданд. Хушбахтона, илова намудани моликияти зеҳнӣ дар CSS ин имкон дод.
Дар мақолаи алоҳида, ман чӣ гуна истифода бурдани андозаи амволи CSS3-ро барои кашидани тасвирҳо дар равзанаи мувофиқ, вале роҳи беҳтарини муфид барои ҷойгир кардани ин амвол вуҷуд дорад. Барои ин, мо ба ин амвол амвол ва арзиши зеринро истифода мебарем:
миқдори аслии: cover;
Амволи калидии калидии браузери браузер барои таҳрир кардани тасвири мувофиқ барои тиреза, новобаста аз он ки калонтарин ва хурдтарини он тиреза аст. Тасвир барои фарогирии тамоми экран паҳн мешавад, вале таносуби аслӣ ва паҳнои паҳлӯӣ бетағйир нигоҳ дошта мешаванд, пешгирӣ кардани тасвир аз худи он вайрон мешавад.
Тасвир дар тиреза ба қадри имкон имконпазир аст, то тамоми тирезаро фаро гирад. Ин маънои онро дорад, ки шумо дар саҳифаҳои худ ё ягон тасодуфан дар тасвири шумо ягон саҳифа надоред, вале он ҳамчунин маънои онро дорад, ки баъзе тасвирҳо метавонанд вобаста аз миқдори паҳлии экран ва тасвири масъала истифода бурда шаванд. Масалан, кунҷҳои тасвир (ё боло, поён, чап ё рост) метавонанд вобаста ба арзишҳои шумо барои моликияти мавқеи мавқеъ истифода шаванд, дар тасвирҳо бурида шаванд. Агар шумо аломати "ба чапи боло" равед, ҳама гуна тасвир дар тасвир аз поёни рост ва чапҳо рост меояд. Агар шумо тасвири заминаро ба маркази худ баргардонед, барзиёд аз ҳамаи тарафҳо меояд, аммо аз он зиёдтар паҳн мешавад, таъсири ҳар як тараф на камтар аз он хоҳад буд.
Чӣ тавр истифода бурдани андозаи фармоиш: cover;
Ҳангоми ташкили тасвири аслии худ, ин фикри хубе барои эҷоди тасвир, ки хеле калон аст. Дар ҳоле, ки браузерҳо бо тасвирҳои хурд назар ба таъсири тасвири он дар сифати визуалӣ, вақте ки браузер тасвирро ба андозаи калонтар аз андозаи аслӣ фарқ мекунад, сифати визуалӣ нопадид мегардад, пластикӣ ва печидатар мешавад. Ин саҳифа дар он аст, ки саҳифаҳои шумо ҳангоми вуруди тасвирҳои калонро ба ҳамаи экранҳо ҳис мекунанд.
Вақте ки шумо ин корро мекунед, боварӣ ҳосил кунед, ки ин расмҳоро барои суръат ва суроғаи вебсайт таҳия кунед . Дар охир, шумо бояд миёнаравии хушбахтие, ки андозаи калон ва сифати баланд ва андозаи дурусти файлро барои суръати боркунӣ дарёфт кунед.
Яке аз роҳҳои маъмулӣ барои истифодаи тасвирҳои тақвимии он вақте, ки хоҳед, ки ин тасвир барои замимаи пурраи саҳифа, агар ин саҳифа васеъ бошад ва дар компютери мизи корӣ назаррас бошад ва ё хеле хурдтар аст ва ба мобилӣ, мобилӣ фиристода мешавад дастгоҳҳо.
Тасвири худро ба соҳиби вебсайти худ бор кунед ва ба CSS-и худ ҳамчун тасвири замина илова кунед:
background-image: url (фокус-over-wdw.jpg);
background-repeat: no-repeat;
мавқеи зеҳнӣ: маркази марказӣ;
замима кардани замима: fixed;
Илова кардани интернети CSS-ро пешакӣ илова кунед:
-мавҷудияти фармоишӣ: фарогирӣ;
-моз-фармоиши фарогирӣ; cover;
-то-андозаи фарқияти: cover;
Сипас моликияти CSS илова кунед:
миқдори аслии: cover;
Истифодаи тасвирҳои гуногун, ки дастгоҳҳои гуногун доранд
Дар ҳоле, ки намунаи ҷавобӣ барои таҷрибаи мизи корӣ ё таҷҳизоти компютер муҳим аст, гуногунии дастгоҳҳое, ки метавонанд ба Веб дастрасӣ дошта бошанд, ба таври назаррас афзоиш ёфтанд ва фарогирии васеътари экранҳо бо он алоқаманданд.
Чӣ тавре, ки қаблан қайд карда будем, масалан, тасвири хеле зебо дар бораи смартфони мобилӣ, масалан, тарроҳии самарабахш ё бонизоми дақиқ нест.
Омӯзед, ки чӣ гуна шумо метавонед саволҳои ВАО-ро барои хидматҳои тасвирҳо, ки ба дастгоҳҳои дар он нишон додашуда мувофиқанд, мувофиқат кунед ва ҳамоҳангсозии вебсафҳаи худро бо дастгоҳҳои мобилӣ беҳтар кунед.
Мақолаи аслӣ аз ҷониби Ҷенфери Кринин. Аз ҷониби Jeremy Girard таҳрир карда шуд 9/12/17