16: How to Create HTML5 Videos and Embed Videos | Learn HTML and CSS | Full Course For Beginners

Подписаться 471 тыс.

Просмотров 473 тыс.

50% 1

FIND MY 2023 COURSE HERE: • 1 | INTRODUCTION TO HT...
How to create HTML5 videos and embed videos | Learn HTML and CSS | HTML tutorial | Basics of CSS. In this lesson we will learn to create HTML5 videos and how to embed RU-vid and Vimeo videos on your website.
➤ GET ACCESS TO MY LESSON MATERIAL HERE!
First of all, thank you for all the support you have given me!
I am really glad to have such an awesome community on my channel. It motivates me to continue creating and uploading content! So thank you!
I am now using Patreon to share improved and updated lesson material, and for a small fee you can access all the material. I have worked hard, and done my best to help you understand what I teach.
I hope you will find it helpful :)
Material for this lesson: / lesson-material-42361704

Опубликовано:

19 май 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 248

@Dani_Krossing Год назад

NEW UPDATED 2023 COURSE AVAILABLE! 🙂 You can find it here: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-v8jDnBYc0bs.html&ab_channel=DaniKrossing

@JayRondon 4 года назад

i think there should be a separate video explicitly on padding, margins, pixels, percent, and positioning.

@bobbychicano 4 года назад

Thank you for taking the time to create this lesson.

@furukh4564 4 года назад

Embedding a video online - 8:00

@DLiberator78 6 лет назад

Another great tutorial. Many thanks. This was really helpful as inserting videos into websites can be tricky. I am happy to hear that your next video is going to be on responsive design as I have some questions about using absolute values in sizing by pixels as opposed to sizing by percentage.

@axelcarvalho2661 5 лет назад

Wow! Great explanation. Thank you.

@TheGamingBeehive 3 года назад

Thank you very much. I needed this. However, this presented an issue. There was too much space beneath the video. The way I solved it was by putting in videowrapper and the margin-bottom - (minus) whatever pixels I need. Worked like a charm. Thank you once more for the tutorial!

@taspepi3401 5 лет назад

Great video mate... the most clear and well explained tutorial on youtube

@deshantdevkota2563 5 лет назад

been watching for a couple days really simple for beginners

@RichardHema 5 лет назад

Thank you, appreciate your sharing, awesome tutorial and very well explained.

@ulysse8182 5 лет назад

I really enjoy learning with your video, thank you for your work!

@MyRandomnessStuff 4 года назад

big up man this video helped me out in 2019

@sktech2001 3 года назад

i like your practical oriented approach and it will surely give confident to build professional website . thank you

@frankie_goestohollywood 5 лет назад

Thank you - love your videos !!!

@kyrinbetts 3 года назад

For anyone new, a wayyy simpler way to change embed size is to set its container's height, then use { height: inherit; } This sets the 's height to that of its parent element.

@mareknovak1147 2 года назад

thank you man. also, I have a question as you seem to understand HTML well. When I´ve got multiple tags with different classes, how does each know its ending tag, when they are not distinguished in any way? Thank you in advance

@kyrinbetts 2 года назад

@@mareknovak1147 I think I understand what you're saying but it does it based on nesting. Let's say you have one div inside another div. The innermost divs are seen as together, because it's nested inside the other.

@milliconsolutions5377 3 года назад

Thanks man. This was a well-explained video.

@cwang9945 3 года назад

Thanks a lot! Very clear explanation.

@sandygeddry724 5 лет назад

This information is very helpful. I think that RU-vid has changed the options you are allowed to control when embedding a video. There is no option to turn off suggested videos when the video finishes. Do you have a way to do this with some coding? It's very annoying to have suggestions pop up on a web page when the video ends. Thank you.

@27yungcash 5 лет назад

Hello! Your tutorials have been great so far. I have learnt a lot. However, the video integrated fine but the sound isn't coming out. How do I correct this please?

@khoatran6722 4 года назад

Awesome lesson and very easy to follow along

@azarmedia 2 года назад

Thanks man it was very helpful.

@selpink579 4 года назад

THANK YOU SO MUCH, YOU HELPED ME WITH MY COURSE WORK 🥺🤩🤩🤩🤩🤩🤩🤩

@vaylx2253 3 года назад

Great job mate, thanks.

@donalpaccio4233 2 года назад

Thank you for your video! It was a much help!

@divyabharti1561 3 года назад

Thanks for your video, it's help me lot, I was stuck at video input...😊

@calibr0636 5 лет назад

Thanks a lot man

@sujitgupta7004 3 года назад

Pepole like u r really helping others learns....♥️

@Sweet50 3 года назад

Thank you so much. You helped me a lot

@coursdedessin-artacademiep927 5 лет назад

Thanks man, really helped my site.

@j4n2k93 5 лет назад

Thank you so much

@jandras1 2 года назад

Top notch tutorial. Thank you.

@gopinath7172 4 года назад

Super bro... Its worked and quite responsive too.

@nandapandey8229 3 года назад

thanks for teaching me how to embeld a video in my own web site, have a nice day

@Goatress 2 года назад

Thx, your videos are awesome!

@abdurrehmankhan592 3 года назад

thank you so much sir Danial.I am having some problems with setting the width and height of video.no matter what I do the width does not change.But I know I will find the solution shortly.thanks again.

@westbankstudios9529 3 года назад

Best Video Dani it helped me out greatly thanks!

@hector_sh3861 Год назад

Thanks a lot my bro, very helpful for me. New subs,

@samezati716 4 года назад

super helpful - Merc

@vodahory378 5 лет назад

Super tutorial - tnx.

@zbytecny-clovek-9314 4 года назад

Thank you so much! :-)

@chamithweerasinghe889 6 лет назад

#Thanks Brother

@farhaasghar6625 5 лет назад

Well done

@michaeldanso3780 3 года назад

In fact l love your videos. Thanks so much

@higherpurpose1212 3 года назад

My problem with this is I cannot use position: relative to the video wrapper, because my header menu is already set to relative to avoid my dropdown submenu from pushing the contents in the body. I set my wrapper to have a fix height and width, and then set the iFrame height and width to both have 100%, but it's not responsive like the one you have.

@XTUBER010 3 года назад

Hi Mmtuts, thanks for the video. Do you have any videos on how to embed a simple URL? like.. extract the meta tags and show a little preview to the link on your website, e.g. with an Image, title, and description? Thanks!!

@AM-vv7xr 6 лет назад

thank you man!!!

@jk-op3ht 6 лет назад

Following you from India

@StudyReadEducate 6 лет назад

Waiting for a long long vlog daniii from long time when we can see your vlog .....i really wanted to see the area where u live and lot lot more i wanted to see

@apoorvsinha5193 2 года назад

Thanks man

@paulhope328 2 года назад

Wow thanks a lot

@Letsgo-xc9nc 3 года назад

Great video! hey can you do an addon video that shows how to add text overlay over the embedded video

@LukGamesCZ-rm3db 8 месяцев назад

Hello, how can I rewind by 1 second and via shortcut key with arrows but make it not mp4 and not via youtube but make it when I add a link?

@rahulmudupurigeek1994 4 года назад

@mmtuts how did you able to get that padding values ??

@jacksam0001 Год назад

Wow you rock it

@nguyenduynguyen2047 4 года назад

thanks man

@rajatvaish1797 4 года назад

Hey man, following your video tutorial to learn HTML & CSS. Love them and they are really helping me understand it. Have a doubt: Firstly, why did you put height=0px and isn't padding used to create that idle space where nothing can be put? Because here you've put the whole youtube video in that box.

@kiaabdi6103 3 года назад

It's because of the position:absolute, and of course the relative position of the parent tag, when you set the position to absolute the height of the parent tag does not matter and the only important thing is the actual size of the parent tag that has the relative position (even if it's created by padding and not with width and height)

@PhilippeHenrique 6 лет назад

20:03 How do you resize the window and the elements just update without releasing the mouse??? On my windows 10 I can't do that

@IAmSolomon 6 лет назад

Awesome video, but just a heads up for anyone using bootstrap you can use: class="embed-responsive-item" to make your video 100% responsive. Here is an example below:

@calibr0636 5 лет назад

Thank you man, for the video, I just converted a random RU-vid video to mp4 and embedded it in the coding. And now I think I can just open the website and listen to music without WiFi.

@bernardmccarthy1438 5 лет назад

u are cancer smart sir

@psychicguide8900 4 года назад

The video wont play when you go offline lol

@elliottgreenhill1 3 года назад

@@psychicguide8900 if he converted it so MP4 though, he has saved on his comps no? so wouldnt need wifi, I may be wrong

@salvagarcia6084 5 лет назад

Great video

@vnsminerlimited1585 5 лет назад

your video is great, but one question, how can i 3:07 How to change the quality of the video (same like youtube) in html ? for example we want show video with low internet to people ? can you handle it ? or do you have any video about it ? many thanks if you answer.

@abdennasserelyassin3493 6 лет назад

Continue bro following you from Morocco

@itech40 5 лет назад

MADZ

@LearningSimplified 5 лет назад

Shouldn't we include the .ogg source as the source of a video file? Is it required or an obsolete concept for modern browsers? Anyways, great tutorial sir....

@JalalKhan-br3ld 5 лет назад

this was i guess a tough class for me mate need to watch one more time ...anyway ..

@eligoldstone3753 3 года назад

How would the code look if I wanted to play multiple videos from files on my computer. Specifically, if I had a series of videos that I wanted to play one after the other, and endlessly loop.

@chaplainandrewkuslick8573 2 года назад

quick question how do i embed or loke a website that has more then one video i am trying to creat a appand i want me churches vimeo page in my app but i can only do a single video do i use a embed or would i use a i

@gen_smolskiy 5 лет назад

Hey man, thank you for your help. May I know what application you are using for your sandbox programming? It seems flexible and might work for me as well. Thanks again, this video was helpful!

@Dani_Krossing 5 лет назад

Sandbox programming...? If you mean my text editor then it is called Atom :)

@DwightWalker 3 года назад

That helped make my music video page use responsive design. Thanks.

@thegeez001 3 года назад

You can also place the video/audio links in an array. Check "custom html5 playlist cast roku".

@melfordbirakor 3 года назад

Thanks

@SkepticalBill 3 года назад

thank you

@shivprasadgupta3717 2 года назад

bro awsome

@PhilippeHenrique 6 лет назад

What chrome extension do you used to update elements HTML resizing the window?

@ca4design 3 года назад

Thanks for this tutorial. All works great except in when viewing with Safari browser. Are there any fixes for this?

@king-ci4ob 5 лет назад

goin to subscribe now...

@AllAboutPESPS2 6 лет назад

Hi bro, please make tutorial for downloading file using php procedural programming

@ambientsoda106 4 года назад

Normally you give your wrappers margins and then inner content if need be a absolute and relative position.

@leonradonjanin9479 5 лет назад

How do we use the embed tag and when should we use it instead of ?

@ilya8864 3 года назад

I’d like to know what happens if I change “box-sizing“ of the videowrapper

@Chikwesirikingsley Год назад

Nice ☀️☀️

@VideoNash 3 года назад

thanks

@jessephiri7834 2 года назад

bro this is 2022 l wonder if any changes of embing a RU-vid video on websites have changed to a much easier form if so can you do a video on that. Thank you

@allenklein7462 2 года назад

Hey Dani - Thanks for the video - I would have been lost without it. Got everything working on my pc fine, but once it is uploaded to my server - the image of the player is there, but it will not play. When I hit the refresh button the play button flashes white - then off and nothing. Any suggestions?

@Bright-Great 4 года назад

Please is it advisable to save videos in a folder when working with database, i hard that it slow down server , any advice on how to this for fast loading in php site

@konnilol4 3 года назад

"We had to use something called Flash" Um... About that... I guess we would have a problem with that nowadays... :D

@Jb67912 4 года назад

I'm wondering about putting video files like .MOV in your folder. Upload takes super long. That's my second issue. How can you create a site with videos that has shorter upload time?

@chrinamint 4 месяца назад

My browser is supposedly the latest one, but when I embed my video (an mp4) on my site (using the root folder on the site) only the audio plays, not the video. So then I wanted to make it use vlc player to play it because any video type should play that way...but can't quite get it right.

@clone_nk 4 года назад

why you used 1000px instead of max-width 960px width 96% inside class wrapper ?

@izackappa5679 5 лет назад

Heey very nice and helpful tutorial! I wanna know on what you are working cuz I work in notepad++ and I want your's pls

@danieleyny512 5 лет назад

iZackaPPa he’s using atom.io

@tristanfuentes5068 Год назад

I love you!

@modumuhammedahmedaresphone7997 Год назад

Pls which editor do you use ?

@programmingtacticalcode7968 5 лет назад

I have one question!!! How to change color of timeline in video default is blue on youtube is red pls make Tutorial for that? Answer me

@selvaratnaminkaran1709 6 лет назад

i am waiting for next videos

@nitinverma4117 5 лет назад

Can you make a video player like youtube with ffmpeg?

@robertefremov9380 2 года назад

It's 2021 now, has anything changed regarding more easily embedding videos from YT, the complicated part about scaling the height according to the width?

@deepikashahdeo608 3 года назад

good

@MrScoopss 2 года назад

The most useful lesson I learned from watching the video called “How to Create HTML5 Videos and Embed Videos” on “RU-vid,” is how to embed in a video on my site in the root folder. You can insert them from a website or you can have a link from a site that you have uploaded your own video. It is easy to use your own video you upload on RU-vid or a diffent location because it will use less space and you will not need to worry about using your own hosted website.

@victormartins7346 5 лет назад

thaaaaaaaaanks

@PROTOPROTOMMXXIV 6 лет назад

Great tuts!

@nav-ks6qj 3 года назад

Hello Dani , I am having a issue with putting my webpage inside of an and the webpage showing inside i did not upload it just want to test it

@alexwilson7235 3 года назад

PLEASE, I have a question I have a website and I want to embed a video from RU-vid but I want the embed video including the speed of the video the playback rate. Thank you :)