نمایش عکس ها در html

773 بازدید

نسخه :

نمایش عکس ها در فایل html بسیار پرکاربرد می باشد زیرا ارزش یک تصویر بیش از هزاران کلمه می باشد تا بتوانید به سادگی منظور خود را به مخاطب منتقل کنید . اما در استفاده از عکس ها باید بسیار مراقب باشید زیرا اگر حجم عکس های یک صفحه html زیاد باشد آنگاه زمان بارگذاری آن صفحه در مرورگر کاربر زیاد می شود و ممکن است کاربر پشیمان شده و از سایت شما خارج شود . توصیه می شود که هم این جنبه را در نظر بگیرید که عکس های سودمند برای کاربر جذاب خواهد بود و هم اینکه حجم عکس های مورد استفاده اگر زیاد باشد ممکن است کاربر را فراری بدهد .

تگ <img> برای نمایش عکس ها در صفحات html :

در html از تگ <img> برای نمایش عکس ها استفاده می شود ، به این صورت که باید آدرس عکس مورد نظرمان را در تگ <img> بنویسیم . برای این منظور از مشخصه src در تگ <img> استفاده می شود . در مباحث ابتدایی شرح داده شد که بهتر است بر روی desktop خود فولدری به نام www.mysite.com بسازید و در آن فایلی را که کدها را در آن تست می کنید (با نام index.html) قرار دهید . چنانچه این کار را انجام داده باشید ، اکنون باید درون این فولدر یک فولدر با نام images بسازید تا فایل های عکس ها را در این فولدر قرار دهید . در مثال های بعدی فرض شده است که فایل های عکس شما درون این فولدر قرار دارد . به مثال زیر توجه کنید :

<html>
<head>
</head>
 
<body>
 
<p>
first paragraph .
</p>
 
<img src="images/photo.gif" />
 
<p>
second paragraph .
</p>
 
</body>
</html>

<html>

<head>

</head>

<body>

<p>

first paragraph .

</p>

<p>

second paragraph .

</p>

</body>

</html>

ابتدا درون فولدر images عکسی با نام photo.gif قرار دهید . سپس کدهای زیر را بنویسید :

نتیجه :

first paragraph .

second paragraph .

مشاهده می کنید که عکس مورد نظر بین دو پاراگراف نمایش داده شده است .

سورس کتاب اندروید سورس شبکه اجتماعی اندروید سورس تاکسی یاب اندروید سورس فروشگاه اینترنتی اندروید سورس کد برنامه تاکسی یاب مشابه تپ سی و اسنپ
سورس فروشگاه اینترنتی اندروید سورس کتاب اندروید
دانلود سورس موبوگرام دانلود سورس تلگرام

اسکریپت باران | دانلود اسکریپت و سورس اندروید