آموزش HTML – جلسه پنجم – Image و Video

نویسنده: بابک حبیبی
تاریخ: ۱۳۹۱ - ۰۴ - ۲۷
دسته بندی: HTML اچ تی ام ال

در ادامه ی آموزش HTML که پایه ی طراحی سایت هست به بخش عکس ها و فیلم ها و خصوصیات پیشرفته ی آن می پردازیم.

Images

برای قرار دادن عکس در HTML باید از تگ <img> استفاده کنید.

ضروری ترین خصوصیت تگ img کلمه ی src هست به معنی Source یا منبع برای اشاره به منبع عکس.

ساختار به این صورت می شود :


<img src="URL">

بطور مثال :

<img src="images/logo.png">

Alternative text این خصوصیت که با کلمه ی alt نشان داده می شود به این معنی هست که شما می توانید نوشته ای را به عنوان توضیح عکس یا اسم عکس بر روی آن ذخیره کنید،بدین شکل که وقتی موس روی عکس می ایستد نوشته آشکار خواهد شد.باید گفت این قابلیت برای سئو SEO نیز مفید است ولی ضرورتی برای قرار دادن آن نیست. بطور مثال:

<img src="images/logo.png" alt="لوگوی زوپیرنت">

Image size قرار دادن سایز عکس ضروری نیست و بطور پیش فرض سایز اصلی عکس دیده میشود ولی برای شخصی سازی آن باید سایز را مشخص کرد. به این صورت که Width عرض و Height ارتفاع است. بطور مثال :


<img src="images/logo.png" alt=""لوگوی زوپیرنت" width="90" height="53">

Video

Embedded videos

برای قرار دادن ویدئو در HTML باید از تگ <video> استفاده کنید. دو روش برای قرار دادن ویدئو در HTML هست:

۱- خصوصیت src که برای معرفی یک منبع ویدئو به کار می رود:


<video src="movie.ogv">
 </video>

ویدئو در HTML

۲- تگ Source در داخل تگ Video برای قرار دادن همزمان چند ویدئو:

<video>
 <source src="movie.mp4" type='video/mp4; codecs="avc1, mp4a"'>
 <source src="movie.ogv" type='video/ogg; codecs="theora, vorbis"'>
 </video>

خصوصیت های Source بدین صورت است :
src = آدرس قرار گرفتن ویدئو
type = نوع فیلم / پسوند فیلم برای کاربردپذیری بهتر
autoplay = اگر مقدارش را همین autoplay بگذارید بعد از تمام شدن بطور خودکار از اول پخش خواهد کرد

در قسمت آموزش HTML5 آموزش کاملی در مورد استفاده از ویدئو در HTML یاد خواهید گرفت

برچسب: - - - -

درباره ی

بابک حبیبی،دانشجوی لیسانس نرم افزار،برنامه نویس پی اچ پی،طراح وب،یه سری تخصص هم در شبکه و مباحث امنیتی دارم.

Comments are closed.