09- How to insert Audio and Video in HTML | learn html in 2020


AOA GUYS today we will learn how we add audio in html watch complete video i will tell you a website in the end by this you can download free more stock of music and sound effects just you can sign in there its really good sounds clip there let’s start now i open my text file here i have mp3 file its a audio file i will show you i include this file in my web page and this is a video file and its also include in html i will show you this video also play in my document lets start, here i create a new file in the text file and i give it to a name music .html and save it here it will be saved this with the help of double click i moved it into my browser its empty close it here first i write html code and create some container see here i write my code in which i start my document and in the body in div i write play & audio file and i make a one more div and in which i write play & video file now i add in which our audio file any audio file include in page by two tags first tag is embed and second is audio embed tag basically we use in old version html pages it have limitations now in new html it will be removed i will show you how i add audio in both if you can use embed tag then remove one audio tag from here first of all add audio in embed i will show you where’s my audio file here this is my text file folder and here i make a folder with the name of music means in text file i have music file of html and after this i have a folder with the name of music and in which my audio and video files now same as it i direct now i start my html tag here in embed tag i tell them this file also in text file so i write directly folder name music after this i give file name BACKGROUND MUSIC.HTML here i copy it and here i paste it save & refresh your page here you can see a audio file will embed here you can also give it height & width i give it to height=90 and width=300 and in which two or three more things like loop here its not given one more tag is here autostart or autoplay and there is not here in the tag of embed here you can not have autoplay ,loop because its a old version just height and width is here now i apply here and save it and see see its height is going to be 90 and its width is going to be 300 now play it and see how its work so its work here one more limitation that you cannot add controls in embed tag you cannot add controls so its also their limitation here its embed tag process which i add a audio file now i start with new tag and that’s a audio tag in audio tag what we have now i will tell you first of all add a source in audio tag which is same music and in which include this file BACKGROUND MUSIC.MP3 its a file name now i add all things which i cannot add in embed tag first of all we add controls write controls in which after this i add loop and tell them when our audio will start then it will repeat in 2 times or 3 times again repeat whatever you want and one more attribute we can add and its autoplay and write here save & refresh it here you can see i removed first embed tag so that you can see easily second one after refresh you can see again a audio file will include here now i will check so click it here its works and we have controls also here you can increase or decrease volume also and its also movable see you can start and pause whatever you want so its a audio tag now i see video tag how we work on it one more thing in audio tag you can add url file like i write a paragraph suppose want to add background music now i start a anchor tag and in which write same address which we write in file like music folder background music.mp3 file and here i will tell them click here to play save it see here want to add background music.mp3 in paragraph here hyperlink will generate now when we click it will be opened in same file so its our audio tag that how we add audio in html tag now we learn how we add video in html page for this also use these two tags one is embed tag and second is video tag both tags you can use and i will you the difference first i use video tag in which we have controls and autoplay option and 3rd is they give us full screen i will show you how and in embed tag they give not full screen i will show you in embed tag first of all give it source and tell them what we have video file see the name learn.php.mp4 copy their name and here paste it and in which we cannot add controls and full screen also cannot available save & refresh it see sorry i removed audio tag first after refresh see our file is autoplay and in which we have not full screen option it will be run but without full screen if i want full screen and height, width then i use video tag how we do? in video tag give it source tell them music /learn php.mp4 and here give it controls write controls give a attribute autoplay and here you can give width and height like this width=300 and height=300 save it and refresh here it will show you first video by embed tag and second video is by video tag so in which you have controls full screen option also available i will show you by start video will be start here you can do full screen after this you can do picture in picture see here it will e change into small picture so its our video tag and audio tag that how we add audio and video in html page and in the start of lecture i will told you a website for download music and effects here you can see and i add also and its name is audioblocks.com in which you can search and music and sounds effects also find from here which you can use like i show by play this is sound effect file here you can see & listen so here after sign up you can search sounds here take care ALLAH HAFIZ

One thought on “09- How to insert Audio and Video in HTML | learn html in 2020

Leave a Reply

Your email address will not be published. Required fields are marked *