Dunkel

How To Create A Website Using HTML And CSS Step By Step Website Tutorial

Web dev
Abonnieren
Aufrufe 1 312 800
95% 21 519 1 081

How To Create A Website Using HTML And CSS Step By Step Website Tutorial.
In this videos you will learn to create a website using HTML and CSS in notepad or any text editor, You will learn to create the header part of the website, I will show you how to add background image in HTML website, Create navigation menu using html. This is a complete tutorial for beginner, who want to learn HTML & CSS website development.
Here are the steps in this HTML website tutorial:
1. Create HTML file and CSS file in a folder
2. Link CSS file with HTML
3. Add background image in HTML website
You must save your image in the same folder and write the complete path of the image in CSS file to add image in website
4. Create navigation menu in HTML website
5. Change the Image opacity in HTML website
6. Add hover effect using HTML and CSS
7. Add Logo in website using HTML & CSS
8. Add title text (welcome text) in Website
9. Create Button in HTML and CSS
Now the Header part of the website has been completed using HTML and CSS
Facebook Page : facebook.com/Rvwebtutorials/
=============********==============
Check some popular videos on my channel:
Awesome image hover effect with html and css - zoom in and out || web dev:-
de-vid.com/video/video-a_ldg5EI9MU.html
----------------------------------------------
css positioning explained with examples (static,relative,absolute,fixed):-
de-vid.com/video/video-L_B2RZm-5VI.html
----------------------------------------------
css image hover effect - Css Tutorial - Css3 Hover Effect:-
de-vid.com/video/video-gu8AceXa5Pg.html
----------------------------------------------
how to change text selection color in html and css:-
de-vid.com/video/video-gCGnwS2uRdw.html
----------------------------------------------
how to make Simple css3 loading animation:-
de-vid.com/video/video-1pC_r_AKlmg.html
----------------------------------------------
How to create contact form using html and css:-
de-vid.com/video/video-ubCG1evvZws.html
----------------------------------------------
How to make fullscreen video background using html and css:-
de-vid.com/video/video-1RrR_d4yGJ8.html
----------------------------------------------
Advance text shadow hover effect using html and css:-
de-vid.com/video/video-FFhDA5XB3CA.html
----------------------------------------------
How to create fixed navigation bar using html and css:-
de-vid.com/video/video-2M3QXuBDQBM.html
----------------------------------------------
how to create animated Dropdown menu using html and css:-
de-vid.com/video/video-EGr4rEgmJ9E.html
----------------------------------------------
how to create hero image using html and css:-
de-vid.com/video/video-3xLfTaMZkEI.html
----------------------------------------------
simple parallax effect using html and css:-
de-vid.com/video/video-Y4_JLIherrw.html
----------------------------------------------
How to create login form using Html and css:-
de-vid.com/video/video-bORk1gxHPaU.html
----------------------------------------------
How to create animated search bar using Html and css:-
de-vid.com/video/video-JaQSzSn0cIQ.html
-~-~~-~~~-~~-~-
Please watch: "Responsive Image Slider | HTML & CSS"
de-vid.com/video/video-FTHUXF241Ak.html
-~-~~-~~~-~~-~-

Am

 

29 Mär 2018

Teilen:

Link:

Video herunterladen:

Link wird geladen...

Hinzufügen:

Meine Playlist
Später ansehen
KOMMENTARE 1 918
Mer yem
Mer yem Vor 18 Stunden
that the best tutorial i've ever seen thank you so much
Web dev
Web dev Vor 17 Stunden
Thanks for your appreciation
Mer yem
Mer yem Vor 18 Stunden
that the best tutorial i've ever seen thank you so much
Cool Banana
Cool Banana Vor Tag
Why can't I add the background image??? Pls answer
RAIL FANS CLUB -BY SOMESH
Very nice...
Tapan Mahata Batman
my background image is not displayed .what should i do?please reply sir
Cool Banana
Cool Banana Vor Tag
How can I do this in notepad?
Pavan Kalyan
Pavan Kalyan Vor 3 Tage
Bro can I connect data base for this ? (SQL)
Ashish Karkera
Ashish Karkera Vor 3 Tage
Yes. But before that you should add event handlers using a programming language.
stefan costea
stefan costea Vor 4 Tage
if u are not speak english,why put the title in english??!!
Iram Satvilkar
Iram Satvilkar Vor 4 Tage
The background image isn't showing :/
ayush prasad
ayush prasad Vor 5 Tage
In which application he wrote all this codes ?
Ashish Karkera
Ashish Karkera Vor 3 Tage
It's a text editor called sublime
Maxuo
Maxuo Vor 5 Tage
Excellent
peachieangee
peachieangee Vor 5 Tage
I can't insert imageee😢 helppp
Krishn Kant
Krishn Kant Vor 5 Tage
How to apply this theme on blogger?....
E-Study Sphere
E-Study Sphere Vor 7 Tage
Awesome,, your video insist me to subscribe........and done....:-)
ASHRAFUL ALOM
ASHRAFUL ALOM Vor 7 Tage
bhai ap konsa text editor use kar rahe ho
Forgottenweb
Forgottenweb Vor 7 Tage
www.forgottenweb.com more example
TECHNOLOGY FAIZAN
Please website make link now
CraftedGadgetMC
CraftedGadgetMC Vor 8 Tage
Same here. Tutorial is awesome. Can follow through even as a beginner.
BEGIBONG BALA
BEGIBONG BALA Vor 8 Tage
This is not website, this is webpage lol
Jefferin Jobu
Jefferin Jobu Vor 8 Tage
I have one html page (file.html )in pages folder but my CSS/style.css is outside the pages folder.. this scenario how can I use CSS in files.html.. please help me....
Jefferin Jobu
Jefferin Jobu Vor 8 Tage
Hi
Shantanu Tripathi
Like aur subscribe karne hi wala tha video end hone ke baad ki end me music sunke mood kharaab ho gaya.
Web dev
Web dev Vor 8 Tage
Ok no issues
Poonam Rawat
Poonam Rawat Vor 9 Tage
Thanks a lot very helpful... Learn a lot
Dark Knight
Dark Knight Vor 9 Tage
We good and all but how do you link all those things? I mean how do you link services, contacts and all of that? with the main page(with index)
Shipra Bhardwaj
Shipra Bhardwaj Vor 9 Tage
Please ye batayiye ki logo ar template download kaise kregen
Sangam Gts
Sangam Gts Vor 9 Tage
THANK YOU
Sandhya Verma
Sandhya Verma Vor 10 Tage
I don’t get background image on screen
CraftedGadgetMC
CraftedGadgetMC Vor 7 Tage
if it's on the same folder as your style.css file. No need to put url(.../1.jpg) instead... just do: url(1.jpg)
Justice
Justice Vor 7 Tage
oh yeahhh i just resolved the issue right now...
Justice
Justice Vor 7 Tage
same.. please please koi bata dy 2 din bad project submittion hai .. im facing the same exact problem and not having the background image.. what to do now to resolve this issue???
CraftedGadgetMC
CraftedGadgetMC Vor 8 Tage
Just use any background image from any free stock photo source lol. try pexel.com or unsplash.com
Bista Abhi
Bista Abhi Vor 8 Tage
so me yarr ........................
julian julian
julian julian Vor 10 Tage
you are cool....
TeX
TeX Vor 10 Tage
Amazing job bro. It is my first time when i made really nice website from a youtube tutorial. Thank you and keep doing good job! :D
Mohd husain
Mohd husain Vor 11 Tage
Can Anyone plzz reply which application he used for coding
I FLY English
I FLY English Vor 11 Tage
Thank you a lot dude , I literally didn't have to understand you , I just muted the video and followed all the instructions , it is perfect!!!
jimma surender
jimma surender Vor 11 Tage
THANK FOR YOUR LECTURE .
Ripen Khaira
Ripen Khaira Vor 11 Tage
I don’t get background image on screen can you get me some solution for it please ...
Big Bang
Big Bang Vor Tag
you have to write the path that u have on ur pc not copy the path he wrote unless ur picture name and the path is the same as his
Rumailrazaofficialchannel razaofficialchannel
Sir Mari picture show nhi hoti
Pritish Chugh
Pritish Chugh Vor 12 Tage
nice
Alvin Jampazar
Alvin Jampazar Vor 12 Tage
if for tutorial bro u should use english because majority watching is in youtube is speaking english... why english problem? same na same?
Malik Hayat
Malik Hayat Vor 12 Tage
p;lace give js file i iwont of this video
haseeb mudassar
haseeb mudassar Vor 13 Tage
Thanks! bro u describe smoothly and perfectly ...
Mansi Gupta
Mansi Gupta Vor 14 Tage
Sir i have made a website with the help of ur video😍😍
Mansi Gupta
Mansi Gupta Vor 12 Tage
@Web dev thanks to u sir😊😊
Web dev
Web dev Vor 14 Tage
Thanks for your appreciation
Emil
Emil Vor 14 Tage
The picture dosent wanna show up on mine
sweety shiny
sweety shiny Vor 14 Tage
Tqqqq soooo much its really helpful to me.. Basically I don't know hindhi.. But your way of explaining make me interesting to watch.. From today onwards I'm ur new subscriber🙋‍♀️
Pushpa Bhandari
Pushpa Bhandari Vor 16 Tage
Thanks alot sir 😊
Camelia Roy
Camelia Roy Vor 16 Tage
what editor are you using sir?
Web dev
Web dev Vor 16 Tage
Sublime text @camelia
frozen-sn7
frozen-sn7 Vor 16 Tage
Thanks ❤❤❤
sebg0
sebg0 Vor 17 Tage
What program did you use in this video for the code? I’m looking for a good program to buy, but I couldn’t tell which program you used in this video. Thanks!
GamawFouskotous Kai opoion tin vlepei
2019 - 2020 best program and FREE "Visual studio code" for web development is the Best.....the money you have go to udemy(.)com and buy a course
John Cena
John Cena Vor 17 Tage
my page doesnt show anything
sonam yangdol
sonam yangdol Vor 17 Tage
Which text editor are you using?
Eddahbi Aziz
Eddahbi Aziz Vor 17 Tage
please link donwlaod site Html
satyajeet singh
satyajeet singh Vor 18 Tage
great work man salute
Rashmi Tiwari
Rashmi Tiwari Vor 19 Tage
I did not complete watching your video yet.... but couldn't hold myself commenting on your video.... so Paused the Video and commenting....... You are a wonderful teacher..... I watched so many videos on many websites, even paid videos as well but your video is THE BESt. Thank you so much for Helping Us. God bless You.
Web dev
Web dev Vor 19 Tage
Thanks for your appreciation rashmi tiwari
Ognjen Lukich
Ognjen Lukich Vor 20 Tage
Can you just tell me how did you link the html and css? Please?
Rahul Singh
Rahul Singh Vor 19 Tage
by creating a link
Muskan Sharma
Muskan Sharma Vor 20 Tage
Other option
Web dev
Web dev Vor 20 Tage
Ap hi btado other option
Muskan Sharma
Muskan Sharma Vor 20 Tage
Sry sir I'm not Use fb
Muskan Sharma
Muskan Sharma Vor 20 Tage
Sir pls iski coding btayege
Web dev
Web dev Vor 20 Tage
Msg me on my fb page
Justin Hurd
Justin Hurd Vor 21 Tag
I'm glad i can understand the coding, because even though the title is in english, not a full sentence of his was. but even if he did not speak English, his teaching was still very clean cut and straight to the point, so I'd rate it an 8/10.
Lukas Leboss
Lukas Leboss Vor 21 Tag
Thanks a lot I just created a simple website just to add the Google Adsense code to it ! (Because for any reason you need Adsense to get Admob (to add ads to mobile apps) but Adsense asks for a website)
mohit rajput
mohit rajput Vor 21 Tag
Bro project bca ka guide krdo koi ya vedio daldo
Super Gamer Mahesh
Super Gamer Mahesh Vor 22 Tage
download image and logo
Super Gamer Mahesh
Super Gamer Mahesh Vor 22 Tage
link off 1. image 2. logo
Ali Monsur
Ali Monsur Vor 22 Tage
Bro could you please tell me why you didn’t write logo before wrote navbar
Nächstes Video