طراحی سایت

تصاویر html

اسماعیلی
0

تصاویر html  چه ویژگی هایی دارند؟

آموزش  html  درس پانزدهم

مثال :

<DOCTYPE html!>
<html>
<body><h2>Spectacular Mountain</h2>
<img src=”pic_mountain.jpg” alt=”Mountain View” style=”width:304px;height:228px;”></body/>

<html/>

تصاویر html
تصاویر html

متن تصاویر  HTML

در HTML، تصاویر با تگ  <img> تعریف می شوند.

تگ  <img> یک تگ خالی  است، و شامل فقط صفات است و تگ بسته ندارد.

ویژگی src نشانی اینترنتی (آدرس وب) تصویر را مشخص می کند:

مثال

 

<img src="url" alt="some_text" style="width:width;height:height;">

ویژگی alt

اگر کاربر به دلایلی  نتواند تصویر  را مشاهده کند (به دلیل اتصال کند، خطا در ویژگی src یا اگر کاربر از یک خواننده صفحه استفاده کند).ویژگی alt یک متن جایگزین برای یک تصویر را فراهم می کند.

اگر یک مرورگر نتواند تصویری را پیدا کند، مقدار ویژگی  alt را نمایش می دهد:

مثال :

<img src="wrongname.gif" alt="HTML5 Icon" style="width:128px;height:128px;">
 ویژگی alt مورد نیاز است. یک صفحه وب بدون آن اعتبار درستی ندارد.

اندازه تصویر – عرض و ارتفاع

شما می توانید از ویژگی style  برای مشخص کردن عرض و ارتفاع یک تصویر استفاده کنید.

مقادیر در پیکسل مشخص می شوند (بعد از مقدار از px استفاده می شود):

مثال :

<img src="html5.gif" alt="HTML5 Icon" style="width:128px;height:128px;">
شما همچنین می توانید از ویژگی های عرض و ارتفاع استفاده کنید. در اینجا، مقادیر به طور پیش فرض در پیکسل تعریف می شود:
مثال :
<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">
توجه: همیشه عرض و ارتفاع یک تصویر را مشخص کنید. اگر عرض و ارتفاع مشخص نشده باشند، صفحه هنگام بارگذاری تصویر، چشمک می زند
عرض و ارتفاع یا style ؟هر دو ویژگی عرض، ارتفاع و style  در HTML5 معتبر هستند. با این حال، ما پیشنهاد می کنیم  از ویژگی style  استفاده کنید. این مانع از  تغییر اندازه اصلی تصاویر می شود:

مثال :



<!DOCTYPE html>
<html>
<head>
<style>
img {
width:100%;
}
</style>
</head>
<body>

<img src="html5.gif" alt="HTML5 Icon" style="width:128px;height:128px;">
<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">

</body>
</html>

برچسب ها
اسماعیلی
0

مطالب مرتبط

کامنت ها در html

کامنت ها در html

12 مهر 1396
عناصر فرم های html

عناصر فرم های html

5 آبان 1396
موقعیت جغرافیایی HTML5

موقعیت جغرافیایی HTML5

22 آبان 1396
پخش ویدئو در html

پخش ویدئو در html

18 آبان 1396

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا