Гипертекст белгилөө тилинде (HTML), баракчадагы сүрөттү көрсөтүү үчүн атайын "tag" буйругу колдонулат. Бул тег img деп аталат жана өзгөрүлмө жыйындысын камтыйт - "атрибуттар". Атрибуттардын жардамы менен гипертексттик баракчадагы сүрөттү чагылдыруунун бардык аспектилерин, анын өлчөмдөрүн аныктай аласыз. Бирок, көйгөйдү чечүүнүн бирден-бир жолу эмес - Cascading Style Sheets (CSS) аркылуу сүрөттүн көлөмүн кичирейтсеңиз болот.
Нускамалар
1 кадам
Бийиктиги жана туурасы атрибуттарын керектүү сүрөттү көрсөтүү үчүн жооптуу тегге жайгаштырыңыз. Биринчисин сүрөттүн вертикалдык өлчөмүнө, экинчисин туурасынан коюңуз. Эки санды тең пиксел менен коюңуз, бирок бирдикти - px - көрсөтүүнүн кажети жок. Бул атрибуттар үчүн керектүү маанилерди эсептөөдө, сүрөттүн кыскаруу пропорцияларынын сакталышына көңүл буруңуз, антпесе ал бурмаланган түрдө көрсөтүлөт. Мисалы, баштапкы өлчөмдөрү 500дөн 300 пиксельге чейин болгон SomePic.
2-кадам
Баштапкы сүрөттүн өлчөмдөрүн пропорционалдык кыскартууну пайыз менен койсоңуз болот. Бул үчүн, бийиктиктин атрибутун туурасын көрсөтпөстөн гана колдонуңуз жана өлчөмдү аныктаган соң пайыз белгисин кошуңуз. Мисалы, ушул формада жазылган тег менен мурунку кадамдагы мисалдагыдай натыйжага жетише аласыз:
3-кадам
Эгерде сиз сүрөттөрдүн өлчөмүн стилдердин сүрөттөмөсүн колдонуп көрсөтүүнү кааласаңыз, анда ошол эле тег атын - img - жана атрибуттарын - туурасы жана бийиктигин колдонуңуз. Бул учурда өлчөө бирдиктери - px, pt же% - ар дайым көрсөтүлүшү керек. Барактагы бардык сүрөттөрдүн өлчөмүнүн жарымын азайтуу үчүн, стилдин сүрөттөмөсүнүн блогуна төмөнкү жазууну коюңуз: img {height: 50%;} Эгерде сиз бир гана сүрөттүн көлөмүн азайтышыңыз керек болсо, анда кошумча id атрибутун кошуңуз аны ушул баракчанын маанисиндеги сүрөттөр үчүн уникалдуу кылып дайындаңыз - мисалы, PicOne: Стил жазуусуна бирдей маани кошуп, аны тег аталышынан "таштанды" # менен бөлүп алыңыз. Бул учурда стилдин толук сүрөттөлүшү төмөнкүдөй болушу мүмкүн: img # OnePic {бийиктик: 50%;}
