94-3-19، 03:19 عصر
اگر شما عکسی را دارید که میخواهید ازش استفاده نمایید ولی اندازه عکس برای شما مناسب نیست شاید به قدری بزرگ باشد که تمام صفحه را اشغال کند یا شما اندازه بزرگتر تر از اندازه تصویر بخواهید
میتوانید اندازه عکس خود را تغیر دهید این کار باشناسه عرض و ارتفاع عکس برای html به تگ img انجام بدهید
فرض کنیم یک عکس با نام learn_html.gif داریم و می خواهیم آنرا کوچکتر از اندازه اصلی آن نشان دهیم. تنها چیزی که باید بدانیم اندازه اصلی عکس است.
حالا می خواهیم شناسه های width و height را در تگ عکس وارد کنیم. تگ ما به این صورت در می آید:
حالا کافی است اندازه مورد نظر را در بین دو دابل کوت ( " " ) وارد کنید. برای مثال من اندازه 100 را برای عرض و 50 را برای ارتفاع وارد می کنم . به صورت زیر:
برای بزرگتر کردن عکس هم کاری مشابه بالا را انجام می دهیم:
مثلاً با عرض200 و ارتفاع 100:
همانطور که ممکن است متوجه شده باشید در تصاویری که با این روش تغییر اندازه پیدا می کنند اگر به نسبت بین عرض و ارتفاع عکس رعایت نشود ممکن است تناسب عکس به هم بخورد. مثلاً تصویر بیش از حد کشیده به نظر برسد و...
اگر بخواهید تصاویر با همان نسبت قبلی تغییر اندازه پیدا کنند باید نسبت بین عرض تصویر و ارتفاع آن را به دست آورید مثلا وقتی من مو خواهم تصویری با عرض 100 پیکسل داشته باشم می توانم به این صورت ارتفاعی را که در آن تناسب عکس به هم نمی خورد پیدا کنم:
حال اگر من اندازه تصویر را با عرض 100 پیکسل و ارتفاع 56/2 پیکسل تعریف کنم تصویری با همان تناسب تصویر اصلی به دست خواهیم آورد مانند زیر:
برای راحتی کار می توانید تصاویر را با استفاده از برنامه های گرافیکی مثل فتوشاپ، کارل دراو و... اندازه تصاویر را تغییر داده و بعداً در صفحه خود استفاده کنید. در این صورت کار شما راحت تر است و گذشته از راحتی وقتی عکسی را با یک برنامه گرافیکی کوچک می کنید سایز فایل عکس هم کوچکتر می شود و بارگذاری صفحه شما را طولانی نمی کند.
میتوانید اندازه عکس خود را تغیر دهید این کار باشناسه عرض و ارتفاع عکس برای html به تگ img انجام بدهید
فرض کنیم یک عکس با نام learn_html.gif داریم و می خواهیم آنرا کوچکتر از اندازه اصلی آن نشان دهیم. تنها چیزی که باید بدانیم اندازه اصلی عکس است.
حالا می خواهیم شناسه های width و height را در تگ عکس وارد کنیم. تگ ما به این صورت در می آید:
کد:
<img src="learn_html.gif" width=" " height=" ">کد:
<img src="learn_html.gif" width="100" height="50">مثلاً با عرض200 و ارتفاع 100:
کد:
<img src="learn_html.gif" width="200" height="100">اگر بخواهید تصاویر با همان نسبت قبلی تغییر اندازه پیدا کنند باید نسبت بین عرض تصویر و ارتفاع آن را به دست آورید مثلا وقتی من مو خواهم تصویری با عرض 100 پیکسل داشته باشم می توانم به این صورت ارتفاعی را که در آن تناسب عکس به هم نمی خورد پیدا کنم:
کد:
77÷137=0.562
height÷100=0.562 ---> height=100×0.562 ---> height=56.2کد:
<img src="learn_html.gif" width="100" height="56">