کاربرد عناصر چند رسانه ای، آموزش تگ Picture در html

کار با تصاویر در html:

در این بخش، به معرفی تگ <picture> و همچنین نکاتی برای سرچ تصویر،معرفی سایت هایی برای دانلود تصویروآیکون می پردازیم.

<picture> : برای درج تصویراستفاده می شود،همچنین با استفاده ازاین تگ می توانیم نمایش تصویر در دستگاه های مختلف (موبایل،تبلت و...) را کنترل کنیم.در این تگ، ازتگ های <img> و<source>  استفاده می شود.

<source> : آدرس تصویر را مشخص می کند.این تگ دارای صفات زیر می باشد:

• srcset : آدرس تصویر را در این قسمت وارد می کنیم.
• media : که شامل  minimum و maximum سایز دستگاه را مشخص می کند.
• type : نوع mime تصویر، فیلم و صدا را مشخص می کند.mime شناسایی نوع فایل توسط مرورگرها می باشد.

شکل دستوری <picture> : 
 

<picture>
         <source srcset=”pic.webp” media=”(min-width:1000px)” type=”image/jpeg”/>           <source srcset=”pic.png” media=”(min-width:700px)” type=”image/png”/>
         <img src:”pic.webp” alt=”car”/>
</picture>

ممنون که تا اینجا با ما همرا بودید،برای یادگیری و درک بهتر مطالب، می توانید ویدئو آموزشی این بخش را خریداری کنید.

نظرات

---

امیرعلی

سلام. دوره رو خریدم، سوالاتم رو کجا باید بپرسم؟

پشتیبانی 1

سلام امیرعلی جان، ممنون که با درسمن همراه شدی، امیدواریم تجربه های قشنگی براتون رقم بخوره.

سوالاتتون میتوانید در انجمن برنامه نویسی درسمن مطرح نمایید.

 

میلاد

سلام دوره اموزش html وcss بسیار کاربردی هستش هم برای طراحی سایت و هم برای درآمد شما خیلی خوب آموزشش دادید ساده و کامل ممنون چون عالی بود

پشتیبانی 1 سلام و درود خدمت شما، ممنون نظر لطف شماس، موفق باشید