Create A Portfolio Website Using HTML and CSS Only - Easy Tutorial
HTML-код
- Опубликовано: 27 окт 2024
- Create A Portfolio Website Using HTML and CSS / Portfolio Kaise Banaye / portfolio website html css
In this video we are going to Creating a personal portfolio website is essential for showcasing your skills and projects to potential employers and clients. In this tutorial, we will guide you through building a responsive personal portfolio website using HTML and CSS. We'll cover everything from designing a visually appealing portfolio website with HTML and CSS to incorporating JavaScript for enhanced interactivity. Our step-by-step portfolio website tutorial will ensure your site is functional, attractive, and responsive, looking great on any device. By the end, you'll have a fully functional, responsive personal portfolio website that highlights your work effectively. Whether you're a beginner or refining your web development skills, this comprehensive guide is perfect for creating a portfolio website that stands out.
Click Here for Complete Website : • Create A Responsive Po...
🔥🔥🔥🔥👇👇👇👇👇👇👇🔥🔥🔥🔥🔥🔥🔥
This Video Like Aim:
Like Aim :- 11000 likes ❤️
Google Drive Link :
drive.google.c...
🔥🔥🔥🔥👆👆👆👆👆👆👆🔥🔥🔥🔥🔥🔥🔥
---------------------------------------------------------------------------------------------------------------------------------------
Links Used in this Video👇:
⚠️Note⚠️: Use Angular Brackets before and after the given code
In head Tag:
link rel="stylesheet" href="cdnjs.cloudfla..."
In CSS File:
@import url('fonts.googleap...
---------------------------------------------------------------------------------------------------------------------------------------
👇👇🫶Follow us on🫶👇👇:
❤️😍Join Our Telegram Group😍❤️
t.me/procoder09
📂follow us on github
github.com/rit...
📷 Follow us on Instagram
/ procoder09
🌏Visit our website
procoder09.blo...
▶ Subscribe Our Channel
/ @procoder09
Any Paid Promotion or Collobration mail me : riteshranjan032002@gmail.com
Thanks to :
@code @codewitha @CodeWithHarry @ProcoderBD @procoder09
#portfolio #frontend #webdevelopment
👇 Here's the full portfolio website. 👇
ruclips.net/video/xtK57s6QN28/видео.htmlsi=Ks_dIl7cmuUyT7-g
Like, share, and comment your opinion. Don't forget to subscribe and support our channel!
if you like this video
please support our channel here:
UPI ID: ritesh.r3@paytm
sorry but I have another question, how do you combine the css and html file so that when you launch it, it launches both and not just the html?
@@Tensen_450 link the css file with html in head section
Which extension did you use to show the website in mobile and ipad view??
@@ProgrammerSushant49 That's mobile simulator
Where do I get the img
This is by far the best video i have ever seen dayum 🔥🔥
just wait few hours , you will get the full website of this landing page
Hey, your videos are great! Adding a voice-over could make them even more helpful, especially for people without a coding background.
@@Masteryincodeandcybersecurity sure, I will try
hey thx bro , im also learning web developing and watching your vids inspire me and I can learn a lot from u ❤
oh that's sounds great ❤
Yea I’m now also learning software and game dev
Looking Crazy🤩
@@anime0903 thanks 🥹
The final project is my favourite part!!!
Superb and fantastic ever, too much appreciated 👏 💐 🥳
Thank You🔥
Really a big fan, don't mind learning from you
No worries I will help you
Thank you so much how do I reach you... this means a lot to me as I've been struggling
@@johnchinemerem-c1k sure just message personally on telegram for any help
i used this template to create a portfolio, ty for the inspiration :d
Welcome
your contents are outstanding 🔥🔥
❤Whoever agrees with me please like❤
Thanks for supporting me
Brother, your video saved many things for me. You are the best. It was for a school project, but brother, you are the best. Thank you. Thank you. I send you a like and a hug, my brother.
@@juanse800a oh that's great, I just want everyone to support the channel and show their presence in upcoming videos also and nothing else
Bro you are such a pro coder you will made a responsive website wow bro vese agar ham apne dwara banai gayi website ko dekhna chahte hai to kaise karenge
You want to make it live
Amazing project! I learned a lot from this video!
Thanks and by the way today i will upload full website of this portfolio, be ready
hey man thank you so much for this video appreciate it
Glad you liked it
Absolutely mindblowing
Thanks ❤
nice video bro keep it up and I am your new sub now
Ok bro
@@procoder09what if it's discord ?
thank you master
@@michaelbautista3055 welcome
bro casually made a fireeeeeeeee website
10:00 good part
nice work man!
thanks bro
thanks for learning i make it by your video thanKyou
@@SRYPlayz welcome
stud tutorial bro hats off
Thanks
Amazing 🙉💙
Thanks ❤️
nice keep up to good work
@@kiyaaannnqttt thanks
Hey You are a great developer and a designer as well you must get a lot of freelance work or must have a high paying job. Do you? Pls tell I wanna pursue this career path.
Hi I really like your tutorial here in this video. Actually I'm on my second week of learning html and css. Your video is such an inspiration...By the way can you tell me what's the title of the song you used in this 5:35 time. Thanks in advance
Wow super bro.
🎉🎉
@@manojbadiger2324 thankyou
Bro add voice over also that will help us to understand easily
@@chinmayalegendI will sure in next video
Obrigado pelo vídeo , meu amigo Ruan me indicou
Thanks for your appreciation and thanks to your friend who shared the video with you
This is fire.
Top content fr
Thanks
That's look awesome! But how to display nav in mobile and tablet?
@@minhinhxuan1224 I have uploaded many videos so go and check it out
i mean the website is responsive but it would've been better if the u didn't set the nav bar's display to be none. a visible nav bar adjusting its size with the screen could be even better
Check the full portfolio website I redesign and make changes
bro loved it !!!
@@amithbhandarkar212 ❤️❤️
Nice tutorial 🙌
Glad you liked it!
Hello bro i just found your channel content was amazing i am just new for this websites and all so can you just help me where can i get this template of full website so that i can refer it once.
i have provided the full website link in pinned comment
On mobile you don't have the navbar to navigate to other links. Btw nice video, love it
i have correct it in the new video go and check the latest portfolio website video
I appreciate that
Thanks
brother suggestion
make a distance between header, paragraph, icons & button
ok i will remember it
It's amazing brother, subscribe at first sight 😂❤,, bro can you create a html bday template for crush 😹🎉 10 sep se phle please bro bana k vid upload kr dena 😢
ok bro, i will try only for you and your love, if the video is not possible then i will share you source Code personally
That's look awesome
@@REXAXOfficial ✨✨
great !!!!.Please what is the extension you're using to view the responsiveness ?
It's a mobile simulator chrome extension
just respect
Buen vídeo pero te dejo algunas cosillas para mejorar, la primera es que no coloques tanto esos comentarios en el vídeo como " comenta tu parte favorita", llegan a ser algo molestos, y luego estaría bueno que expliques cada propiedad, ya que hay cosas que un principiante no sabrá ni por qué se está colocando eso, muchas gracias 😅😊
thanks, i will try to improve and implement
ola disculpa que te moleste pero tu sabes de donde saco el primer link sigo perdido
Imma try this on figma
Ya sure
you're a genius!
ThankYou for this complement
Excelente video bro. Cómo te va con Javascript? Por cierto, dónde aprendiste a hacer todo esto?
@@josueariza605 from RUclips and a lot of practice
Nice design
Thanks❤
Great bro ❤
Thanks
Good job 🎉
Thanks 🤩
hmm wow! this is nice how do you do this with html and css only i thought you will use javascript d way it look it look like u used javascript
i try to provide simplest way of coding and easy to understand and also for animation i used that's a github repo
Hi brother
Can I use it for my website
Not exactly same but yes quite similar
If you allow only then
@@Vidyarthi.jivana yes sure, I have already provided you the link of source code in description but please share and support our channel in future also
cool dude, Please create a animated cool stylish portfolio website with some pages, PLease bro I need a source code of that for my portfolio. And yes you've get a new SUBSCRIBER. Take love.
@@hsprince14 I will create and welcome to your RUclips family
Awesome brother,
I want to ask you something that , im learning css and js
How can i make my basics strong .. mostly css..
A lot of practice and try new things
hey I got confused why don't u explain to get clear idea what actually u r going to do ur portfolio is amazing no doubt i just finished html and css but I'm too much confused it would be more helpful if u able to explain all that :)..
Ok, next time I will
Thankyou cudie
Looking 👀👀👀👀
are you stuck while watching😂😂
Bro my icon doesn't showing
Thanks
@@lubababintaabubakar1718 wlc
it's good
@@TROLLINGBANDA thanks
crazyyyyy fr
@@DhairyaGupta-qn8ji thanks
Nice video, but please could you tell me how you enabled that feature in your browser that allowed you to change between different phone sizes. I really need it.
It's a chrome extension - mobile simulator
Cool
Thanks
hi, I really liked your video but I can't get the different logos to appear like linkedin for example, I looked carefully, no syntax errors, thank you:)
@@Tensen_450 you have to check the link that I used in head section and also you internet is required to visible the icons
@@procoder09 What is the link ?
@@procoder09 ohhhh ok i see the link but but where can I find it pls:)?
@@Tensen_450 in description
ok its good, i did not see the link but i juste saw it in commentary thks
its really nice but you didnt did anything in services, skills, education part. what about that?
I will create that in a few days
Op bro
Thanks
So nice🎉❤
@@angleammuluu1209 thanks ❤️
which extention are you using for checking in different devices?
i use mobile simulator extension
what is name of plugin for responsive check?
mobile simulator
@@procoder09 ops just wow. thanks a lot.
YOU MAKE A REALY GOOD ONE BRO BUT I HAVE A QUESTION WHAT DID YOU in that time 3:30
@@KakashiJod-._-123 I just copy the link of icon and paste it
@@procoder09 where is link?
hi, i have a problem . i cannot position an image or text exactly where i want .
can you help me please
Sure
what extensions you use in video to review all website interface?
Chrome extension - mobile simulator
What is the name of the extension to view the website on multiple screens?
mobile simulator
what extension fo you use to create those
mockups ?
It's a chrome extension - mobile simulator
Where to learn html,css, and js ?
Books recommendations; plz
I can suggest you a RUclips channel for that because I also learn all these from RUclips - @codewithharry
@@procoder09 Thanks ❤, bro.
Good job
thanks
if i learn on w3shcool about css and html , will i be like you when you
coding
@@SRR4I depends how much time you give and try to make project and solving error on your own
appreciated
Thanks bro
i have a question , why don't you use bootstrap in this website ?
It would be easier if you use bootstrap.
Because many of the users don't know about bootstrap here, so I want them to know the easy way to solve it and most of them know css
Hi brother....
plzzz tell the extension u used for changing screen sizes
It's a chrome extension mobile simulator
Bro my jpg image doesn't show up, what do I do?
@@sunilshrivastava1970 check the path again
Please may i know how you get the responsive android smartphone
its a chrome extension - mobile simulator
Which editor you are using
vs code
What is the name of the extension simulator that youve used ?
Mobile simulator
where do you get that logo from? How did you put it in using just code?
i created it and style it
what is the other device viewer extension called??
mobile simulator
when ever i go Fullscreen my text go to the bottom of the picture why is that?
@@Life-ts8sp check your use position absolute
Bro can you name the extension you used for the output of the website, the one you used to view the site on many device.
Mobile simulator
where did you get the image?
Online bro, check description i have provided the image
can i know how you got that "change device" option?
@@ANIMEEATOMICBOMBB it's a chrome extension "mobile simulator"
Hola mira donde sacaste el link osea el primer link en si para que sirve el primer link, afect en algo si no le pongo el primer link?
The link is very important, it is used for icons
can i ask something whenever i add another image it doesnot shows the image pls help me
Check the path
@@procoder09 i couldnot do and my image is in the same folder as the index html
@@InfraSoner ok, send me the code in the telegram personally
Hey Which google extension you use for responsive prototype means mobile or vice versa
Mobile simulator
can you please say the name of the extention used in the beginning of the vedio
Ya sure it's mobile simulator
hey bro what is the extension you used to see the m mobile & laptop version of the website ?
It's a chrome extension mobile simulator
where do I begin, what app do I have to use to code ?
@@CentralDogmaIRL use vs code
Hey what do u wrote for social icons ???
I have provided a link in the description just paste those links in the head section
Bro ,what is the name of the add-on that makes the phone appear like this?
That a chrome extension - mobile simulator
Hi bro, why don't the photos I've tried appear on the web?
Check description