html tutorial - part 2 media

 

adding image:

<img src="here paste link or path to image"> </img>

adding audio:

<audio controls src="here paste link or path to music"> </audio>

adding video:

webm:

<video controls> <source src="here paste link or path to video" type="video/webm"></video>

mp4:

<video controls> <source src="here paste link or path to video" type="video/mp4"></video>

 

putting external website:

<iframe src="here paste link to website, media or anything else"></iframe>

------------------------

for every tag (except of audio) here you can also specify width/height like this:

<img src="here paste link or path to image" width="50px" height="40px"> </img>

 

for <img> tag  you can use alt attribute which can show what is in image when it isnt visible (error or accessibility. for example:

<img src="here paste link or path to image" alt="something here something here..."> </img>

 

for video and audio tags you can use autoplay (no ="" needed) for automatically play it (if not added browser will wait for "user input"). 

also you can use mute for video if you just putted mp4 instead of gif :'D . will also work in audio but there its just useless...

and loop for playing it forever.

-----------------------

alternative way to display media content (note - you need to know type of this content):

<embed type="here paste type of media like image/jpg or video/mp4 or anything else" src="here paste link or patch to this media, can be even browser addon if supported">

note - supports only width/height, and title to show content or error/accessibility.

------------------------

special way to display vector graphics's :

1) svg

<svg xmlns="http://www.w3.org/2000/svg"> {here goes all svg content, tutorial later} </svg>

2) canvas

<canvas> {put your JS here} </canvas>

3) for svg graphics you can also use img/iframe or embed tag ;)

------------------------

thats all i think. next week - next part.