کارگاه آموزشی رایگان - صفر تا صد برنامه نویسی تا کسب و درآمد میلیونی


اضافه کردن تصاویر به صفحه


اضافه کردن تصاویر به صفحه
برای دانلود و دیدن آنلاین این درس نیاز است وارد سایت شوید. در صورت نداشتن حساب کاربری عضو شوید.

اضافه کردن تصاویر به صفحه

برای اضافه کردن تصویر به صفحه خود از تگ <img/> استفاده می کنیم. این تگ یگ تگ اینلاین است. همان‌طور که می‌دانید همه‌ی تگ‌هایی که تاکنون یاد گرفته‌اید یک عمل خاص را انجام می‌داده، با اضافه کردن یک سری صفت به این تگ‌ها می‌توان قدرت آن‌ها را افزایش داد اما از زمانی که css وارد ارسِ برنامه‌نویسی شد، استفاده از این صفات بسیار کم‌رنگ شد. اما هنوز بعضی از تگ‌های Html نیاز واجب به این صفت‌ها دارند. اولین تگی که به این صفات نیاز دارد تگ کوتاه <img/> است. اولین صفتی که به این تگ نسبت می‌دهیم، صفت “”=src است، این صفت به ما کمک می‌کند که آدرس تصویر موردنظر را به دست آوریم. و دومین صفتی که به تگ <img/> نسبت می‌دهیم، صفت “”=alt است. صفت “”=alt از ما یک متن می‌گیرد و اگر تصویر ما به هر دلیلی گم شد آن متن را به‌جای تصویر نشان می‌دهد. صفت “”=alt ازنظر سئو و گوگل بسیار عالی بوده و به بالا رفتن رتبه سایت شما کمک می‌کند.
برای آدرس‌دهی به‌عکس، هرگاه بخواهیم از یک پوشه بیرون بیاییم از .. و هرگاه بخواهیم وارد یک پوشه شویم از / استفاده می‌کنیم.
اگر پوشه بندی که در جلسات پیش توضیح داده شد رعایت کنید، اکنون باید تصویر خور را در یک پوشه و فایل Html خود را در یک پوشه دیگر ذخیره کنید. و حالا میتوانید به راحتی با علامت .. از پوشه Html بیرون آمده و با علامت / و نام پوشه تصاویر، وارد پوشه تصاویر شوید و با اضافه کردن نام تصویر و پسوند آن، آدرس تصویر را به دست آورید.
عرض و ارتفاع تصویر را میتوان با اضافه کردن صفات به تگ <img/> تغییر داد اما ترجیح داده می شود این کار را در css انجام دهیم.

 

 

<!DOCTYPE html>

< Html>

< head>

<title>آموزش وب</title>

</ head>

< body>

<ul>

 <li>

Colors

<dl>

<dt>Red</dt>

<dd>این یک رنگ قرمز است</dd>

<dt>Green</dt>

<dd>این یک رنگ سبز است</dd>

<dt>Blue</dt>

<dd>این یک رنگ آبی است</dd>

</dl>

</li>

<li>

names

<ol>

<li>Ali</li>

<li>Amir</li>

<li>Reza</li>

<li>Sara</li>

</ol>

</li>

</ul>

</ body>

</ Html>

 

اضافه کردن صفت “”=title به تگ <img/> و پر کردن آن با یک متن، باعث می‌شود که هرگاه اشاره‌گر ماوس رو تصویر شما برود، متن شمارا نشان دهد. البته این صفت دیگر استفاده زیادی ندارد و از روش‌های دیگری برای این کار استفاده می‌شود.

 

<!DOCTYPE html>

< Html>

< head>

<title>آموزش وب</title>

</ head>

< body>

<ul>

 <li>

Colors

<dl>

<dt>Red</dt>

<dd>این یک رنگ قرمز است</dd>

<dt>Green</dt>

<dd>این یک رنگ سبز است</dd>

<dt>Blue</dt>

<dd>این یک رنگ آبی است</dd>

</dl>

</li>

<li>

names

<ol>

<li>Ali</li>

<li>Amir</li>

<li>Reza</li>

<li>Sara</li>

</ol>

</li>

</ul>

</ body>

</ Html>

 


برچسب ها :

اضافه کردن تصاویر به صفحه در html تگ img

نظر بدهید

نشانی ایمیل شما منتشر نخواهد شد .
برای ارسال نظر نیاز است وارد سایت شوید. در صورت نداشتن حساب کاربری عضو شوید.
13 جلسه برای دوره آموزش جامع HTML

دوره آموزش جامع HTML


تعداد جلسات 13 جلسه
مدت زمان 408 دقیقه
سطح مهارت مقدماتی تا پیشرفته
زبان فارسی
دانشجو 78 دانشجو
گواهی نامه ندارد
قیمت دوره : 0 تومان
رایگان
مهدی عباسی
مهدی عباسی

درباره مدرس :

مدیر‌ عامل‌ شرکت آریا‌ نرم‌‌ افزار دارنده مدرک کارشناسی‌ ارشد مهندسی کامپیوتر 12‌ سال سابقه تدریس دروس کامپیوتر را در دانشگاههای دولتی، آزاد، پیام‌نور ملایر، شهیدشمسی‌پور تهران و تدریس برنامه‌نویسی در انیستیتو ایزایران، مجتمع فنی و موسسه راه‌آینده تهران دارا میباشد و تا به حال راهنمایی انجمنهای علمی دانشگاه و صدها پروژه دانشجویی را برعهده داشته است. تخصص اصلی: با داشتن گواهی‌نامه‌های معتبر تدریس از انیستیتو‌ ایزایران، راه آینده‌تهران و سازمان‌فنی‌حرفه‌ای، تدریس و آموزش‌ دروس کامپیوتر، ‌برنامه‌نویسی کامپیوتر و کلاسهای کنکور کارشناسی و کارشناسی‌ارشد میباشد.همچنین تجربه داوری و نظارت مسابقات برنامه‌نویسی کشوری‌ACM را در سالهای متعدد داشته و تیم مورد رهبری ایشان در 3سال متوالی مقام اول مسابقات کشوری را از آن خود کرده است.ایشان مقالاتی در زمینه شبکه‌های کامپیوتری، تکنیک‌های وزارت دفاع و ... به ثبت رسانده و مشاور و کارشناس در طراحی و برنامه نویسی بیش از 50‌برنامه کاربردی تحت وب و ویندوز و موبایل میباشد. افتخارات دیگر:کسب مقام دوم ایده‌های برتر در مسابقات استارت‌آپ و بکند کشوری را نام برد.