Netflix clone with HTML and CSS (tutorial for beginners)
HTML-код
- Опубликовано: 14 июн 2024
- In this tutorial we will build netflix landing page with html and css.
This tutorial is suited for beginners wanting to learn html and css.
I try explain all html tags and css properties and why I use them.
timestamps:
0:00:00 - Intro
0:00:10 - explaining html boilerplate I use
0:01:12 - Header (logo, language select, and login button)
0:13:39 - CTA / splash screen (intro texts, signup form)
0:36:05 - Sections with features of netflix service
0:52:55 - Frequently asked questions (with accordion / collpapsible)
1:07:10 - Styling for mobile (css media queries to make it responsive)
1:26:35 - Outro
Man i cant tell how much you help teaching me html and css! Wish i could take private courses from you or udemy... other teachers are crap .. watched your tesla tutorial too, learned a huge ton of info from your videos, and understood nothing from other teachers man. Please post more videos like this like how you explain and overcoming problems so we can understand better like in this video how to cope with them. If you have a donation address let me know like for crypto bnb or ftm i wanna help. Thanks so much
Your comment is better than any kind of donation.
I am in tears of joy right now. There is no money in the world that would make me feel like your comment does.
It gives me tons of motovation to create more videos for people like you.
All I ask for is a like on a video so I can reach more people and maybe some feedback/ideas so I know how I can improve.
Thanks again for leaving the comment.
Hope you learn everything you need!
Have a wonderful day!
/Dawid
Heyyyyy bro really enjoyed your video
Good bohat help li ap ki video sy ma ny lot of thanks brooo
Bro, your video is the most descriptive on RUclips. However, at the moment, the codes are incomplete, the photo does not fully cover the main screen and the color of the buttons is white. No matter how hard I tried, I couldn't fix it. Luckily, that means I can't grasp the logic of the event. Better than fooling myself. Thank you!
Awesome ✌️
love your content
Thank you!
Thank you so much Sir 😊
Maravilhosos seus vídeos para quem esta começando, sua didática é excelente, procurei vários vídeos e o seu foi o melhor dos melhores, parabéns por compartilhar seu conhecimento conosco.👏👏🙂
Eu tbm procurei vídeos de clone da Netflix no Brasil e todos geralmente abordam só metade ou até mesmo nada da página de login, só o dele que achei mais completo!
can you mention the tools has been used in the video like you can know the width of particular element
Thx for the video. Have one question , first question. IN HEADER. Why use text-align: right, and display:inline block for align items and move to Rigth. Is not better 2022-2023, flex box ? Example : display:flex; justify-content: space-between; and align-items: center? THX!
Right... I but I use Display- Inline-flex many times in the header and it works👍.. But I don't know😅 about only flex... Try it and tell me if it works...
Hello Dawid!
How can i put the video behind the png tv? cause i see the halfed control behind of the video
Just use a higher z-index on the image and a lower z-index on the video
Awsome explaination of netflix clone, can you please attached the links if you have create playlists for html, css, bootstrap for beginers it helps a lot.
ruclips.net/p/PLqn5EGK9emRqH7NInYAuZsz210gShEiqI
what is your git repo?
Nice video
But sir what software are you using to measure the size or distance of an object 42:04
Its the inspect which is available on for every website/webpage
Hi I am having a problem aligning Netflix logo and the Log in buttons, I already tried padding, height margin commands nothing seems to be working. Can you give a suggestion?
Vertically or horizontally?
@@CodingWithDawid Hey, that was solved I missed a “;” 😅
But is it possible to give a github link for this project.
I am trying to solve a problem with my code. For some reason the sections are not defined for me.
The first section where there is an image and video saying “enjoy on your tv” that is showing where the email tab is. And its not going down. Where it should be
If you can share the source code it would help a lot
Thanks!
Here is the code: github.com/dejwid/netflix-clone
Thanks a lot.
Bro I'm facing problem when I am trying to😕 make it responsive for mobile can you help me??
You need to be more precise with describing your problem. Share your code on github or sth
hi please image and vide source share
source code pls
Here you go: github.com/dejwid/netflix-clone
you are doing great but poor explanation bruh especially @25:34