Gowtham Tirri
Gowtham Tirri
  • 22
  • 1 006 801
Complete Responsive Website Using HTML CSS | Responsive web design tutorial
How To Create a Complete Responsive Website From Scratch Using HTML and CSS step by step. Responsive website design tutorial, HTML CSS project for beginners
👨‍💻 Source Code : www.buymeacoffee.com/gowthamtirri/e/235414
🎁 Free images :drive.google.com/file/d/1hbNmhAa-vJrcwKQmWo2tCSQGTeVrS_9p/view?usp=sharing
Need Help with Your Code?
🖥️ Custom Coding Projects/Assignments - Get your projects done
👨‍💻 1:1 Tutoring - Personalized sessions in HTML, CSS, JavaScript, React, or Python.
📲 Contact : wa.me/message/WARV2DDU7KIVH1
WhatsApp +91 84315 25084
💬Let's Chat Instagram : gowthamtirri
💝 SUBSCRIBE For More Projects
=========🕘Time Stamps =======
00:00 Intro
00:36 create html and css files
01:50 Create HTML CSS layout for entire website
15:20 Dive in to CSS
47:43 Outro
so, we built this complete nature website in html and css with some little animations and made this website complete responsive in html css
===== = 🎁 Free courses 🎁 ======
🔸 Complete websites using html css and javascript Playlist : th-cam.com/play/PL8ix0dRczzb03lC11sSc8u198l1exLqdU.html
▶️ Javscript Projects Playlist: th-cam.com/play/PL8ix0dRczzb024GkuJQbT2-dtTlrltzFq.html
▶️ HTML CSS Projects Playlist : th-cam.com/play/PL8ix0dRczzb0D9DkDtgSTNKP7Ipm5uFrG.html
Tags:
HTML and CSS Website Design
Make Website Using HTML And CSS
Create Website Using HTML and CSS
Complete Website Design
Full Website Design
complete website in html and css
Make Resonsive Website
Responsive Website Design HTML and CSS
HTML Website
html css responsive website
complete responsive webiste
responsive website using html5 and css3
responsive website using html and css
html css website
responsive website html css
complete website using html and css
responsive website design using html and css
complete web design project
responsive website from scratch
make responsive website html css
complete website in html and css
nature website
website with background image
html css project for beginners
html css web project
มุมมอง: 37 887

วีดีโอ

How To Make Website Using HTML & CSS | Full Responsive Multi Page Website Design Step by Step
มุมมอง 13K10 หลายเดือนก่อน
Complete Responsive Website Using HTML CSS | Responsive web design tutorial | Learn How to Create a Responsive Multi Pages Website Using HTML & CSS, Complete HTML and CSS Multiple Pages Website Design Tutorial 👨‍💻Complete Source Code : www.buymeacoffee.com/gowthamtirri/e/230093 🎁 Download images : drive.google.com/file/d/13WuJchVT5CPRtVN6GEU8po0vrC6W3qOU/view?usp=sharing Need Help with Your Cod...
How to create a Todo List App Using HTML, CSS & JavaScript | JavaScript Project tutorial
มุมมอง 38K11 หลายเดือนก่อน
Javascript project for beginners, Projects using html css and javascript 👨‍💻 Source Code : www.buymeacoffee.com/gowthamtirri/e/221775 🎁 Free Starter Files (Images) : drive.google.com/file/d/1Ll44_TYM3aispJH7C3Kkm5vQYv09zN00/view?usp=sharing Need Help with Your Code? 🖥️ Custom Coding Projects/Assignments - Get your projects done 👨‍💻 1:1 Tutoring - Personalized sessions in HTML, CSS, JavaScript, ...
Complete Responsive Website Using HTML CSS | Responsive web design tutorial | Portfolio Website
มุมมอง 2.4Kปีที่แล้ว
Responsive Portfolio Website Using HTML CSS In this video, You'll learn how to use HTML and CSS. We'll go over things like dividing layouts, CSS Grid, and CSS Flex by building responsive portfolio website in dark mode using HTML and CSS from scratch step by step. By the end, you'll know how to make all sorts of websites on your own! 1-on-1 Classes with me : www.buymeacoffee.com/gowthamtirri/e/2...
How to Create Complete Responsive Ecommerce Website Using HTML and CSS | Responsive Website Tutorial
มุมมอง 10K2 ปีที่แล้ว
In this video we will learn how to create a complete responsive ecommerce website from scratch using html and css step by step. By the end of this video you able to make a complete responsive website in html css from scratch and any other website you can imagine of 👨‍💻 Source Code : www.buymeacoffee.com/gowthamtirri/e/97580 🎁 Free Starter Files (Images) : bit.ly/3gzplBM Need Help with Your Code...
Build Responsive Agency Website Using HTML CSS | Responsive website design tutorial
มุมมอง 12K2 ปีที่แล้ว
If you want to learn web development or known html css and want to build real world websites, this is a perfect html css project for you to build. By the end of this video you able to make a complete mobile responsive website with animations using html and css from scratch. 💝 Subscribe for more 1-on-1 Classes with me : www.buymeacoffee.com/gowthamtirri/e/219232 💬Let's Chat Instagram : instagram...
How To Make a Website Using Html Css In 14 Minutes | Step by Step Tutorial
มุมมอง 29K2 ปีที่แล้ว
In this video we will learn how to create a website using html and css, if you are a beginner learning html and css this is the perfect html css tutorial for you. Follow along and have fun. 1-on-1 Classes with me : www.buymeacoffee.com/gowthamtirri/e/219232 🛴 Instagram : gowthamtirri 🎁 Images & colors : bit.ly/3KXUnND 💝 SUBSCRIBE : th-cam.com/channels/bbP.html... = 🎁 Free courses ...
Complete Responsive Website Using HTML CSS | Responsive web design tutorial
มุมมอง 738K3 ปีที่แล้ว
In this video we will learn how to create a complete responsive website from scratch using html and css step by step. By the end of this video you able to make a complete responsive website in html css from scratch. 🎁 Free images : bit.ly/3JzQzUK 👨‍💻 Source Code : www.buymeacoffee.com/gowthamtirri/e/97581 Need Help with Your Code? 🖥️ Custom Coding Projects/Assignments - Get your projects done 👨...
Html Css Project for beginners | Tic Tac Toe UI With HTML CSS Tutorial
มุมมอง 1.4K3 ปีที่แล้ว
Html Css Project for beginners | Tic Tac Toe UI With HTML CSS Tutorial
Responsive Portfolio Website using HTML and CSS | Responsive website design tutorial
มุมมอง 21K3 ปีที่แล้ว
Responsive Portfolio Website using HTML and CSS | Responsive website design tutorial
Photos App with Vanilla Javascript | Beginner Vanilla Javascript Project Tutorial
มุมมอง 9814 ปีที่แล้ว
Photos App with Vanilla Javascript | Beginner Vanilla Javascript Project Tutorial
Responsive Navbar Tutorial - App Like Mobile Menu | HTML CSS
มุมมอง 18K4 ปีที่แล้ว
Responsive Navbar Tutorial - App Like Mobile Menu | HTML CSS
How To Make A Complete Website Using HTML And CSS | Responsive Website Tutorial
มุมมอง 45K4 ปีที่แล้ว
How To Make A Complete Website Using HTML And CSS | Responsive Website Tutorial
Build A Instagram Bot With Vanilla JavaScript Tutorial | Javascript Project for beginners
มุมมอง 1.8K4 ปีที่แล้ว
Build A Instagram Bot With Vanilla JavaScript Tutorial | Javascript Project for beginners
Build A StopWatch Using Vanilla JavaScript Tutorial
มุมมอง 37K4 ปีที่แล้ว
Build A StopWatch Using Vanilla JavaScript Tutorial

ความคิดเห็น

  • @iwngrid
    @iwngrid วันที่ผ่านมา

    can you help me? when you do this code .services { margin-top: 40px; display: flex; gap: 16px; } in 35:39 Your images were aligned right when you created the code, but mine were crooked, forming a ladder. I don't know where I went wrong, so please, can you help me?

  • @Hodophile99999
    @Hodophile99999 วันที่ผ่านมา

    29:20 How to get Menu button . ( ./img/menu.svg ) Its not working

  • @zuzanastrizova5802
    @zuzanastrizova5802 2 วันที่ผ่านมา

    Love this tutorial! Can u please help me how can i do the navbar fixed? I dont know where to put the position:fixed; it always makes some mess. Thank you!

    • @GowthamTirri
      @GowthamTirri วันที่ผ่านมา

      Thank you! 😊 You can fix the navbar by adding position: fixed; top: 0; width: 100%; to your navbar's CSS. If you still face any issues, feel free to contact me on Whatsapp ( link in description ) for further help!

  • @UmidjonAliyev-n8i
    @UmidjonAliyev-n8i 14 วันที่ผ่านมา

    cod css thml

  • @AzizM27.
    @AzizM27. 14 วันที่ผ่านมา

    good wepsite 😎 uzbek sila 🕶✅☑🟥⚪⚫🟤🟣🟢🔵🟡🟠🔴🔘🔶🔷🔸🔹🔺🔻▫🔳🔲◽◾◻◼⬜⬛🟫🟪🟦🟩🟨🟧

    • @AzizM27.
      @AzizM27. 14 วันที่ผ่านมา

      Uzbek sila

    • @AzizM27.
      @AzizM27. 14 วันที่ผ่านมา

      Uzbek sila

    • @AzizM27.
      @AzizM27. 14 วันที่ผ่านมา

      Uzbek sila

  • @igboechejohn4715
    @igboechejohn4715 15 วันที่ผ่านมา

    Please I need the source code

  • @sabrineTorabi
    @sabrineTorabi 16 วันที่ผ่านมา

    i learned a lot thanks to this great video thank you our legend

  • @archanasarang5592
    @archanasarang5592 22 วันที่ผ่านมา

    thank you so much.. :)

    • @GowthamTirri
      @GowthamTirri 22 วันที่ผ่านมา

      Thanks, Happy coding!

  • @rmlabdullayev
    @rmlabdullayev 25 วันที่ผ่านมา

    hi, thank you very much for the video. very entertaining and informative. though in my case background image was way too big. no mater how I try can't fix it. I dont know if you can help me with advice. Thanks again.

    • @GowthamTirri
      @GowthamTirri 24 วันที่ผ่านมา

      Thanks! share a screenshot of issue your're facing in insta or Wa I'll try to help you out.

  • @oraclechan-7678
    @oraclechan-7678 26 วันที่ผ่านมา

    This is amazing, you're such a good teacher 👌👏

    • @GowthamTirri
      @GowthamTirri 26 วันที่ผ่านมา

      Thanks ❣️ so, glad it helped you

  • @nimitajha8772
    @nimitajha8772 หลายเดือนก่อน

    edit and bin img is not showing in output

    • @GowthamTirri
      @GowthamTirri 28 วันที่ผ่านมา

      Make sure to give a proper path to the image

  • @Chaturrr
    @Chaturrr หลายเดือนก่อน

    Wow it's amazing ❤ so many video i watched but this is just amazing thanku❤❤

    • @GowthamTirri
      @GowthamTirri หลายเดือนก่อน

      So glad, you loved it! ❣️ Subscribe for more!

  • @mustaqeemrajpoot5632
    @mustaqeemrajpoot5632 หลายเดือนก่อน

    where you added .mobile-menu in the css, but you did not write the "menu-button" class in the html?? i am having problem here, the event is not working on click

  • @erickrampah2463
    @erickrampah2463 หลายเดือนก่อน

    This is an eye-opener

  • @SrabontiSinha
    @SrabontiSinha หลายเดือนก่อน

    How responsive is it? Plz reply me

  • @clofsthihi
    @clofsthihi หลายเดือนก่อน

    Yo how to remove the white space on the right side of my screen..

  • @entrepstoriesyt
    @entrepstoriesyt หลายเดือนก่อน

    Please provide the link to the figma as well hehe

  • @MuhammadArshiyan-i4o
    @MuhammadArshiyan-i4o หลายเดือนก่อน

    Beautiful website❤ color theme name?

  • @AdeelNawaz-t3f
    @AdeelNawaz-t3f 2 หลายเดือนก่อน

    react project

  • @syedmuneeb1042
    @syedmuneeb1042 2 หลายเดือนก่อน

    thanks bro for grow my knowledge

    • @GowthamTirri
      @GowthamTirri 2 หลายเดือนก่อน

      Glad it helped you

    • @syedmuneeb1042
      @syedmuneeb1042 2 หลายเดือนก่อน

      @GowthamTirri brother please like it for react js

    • @syedmuneeb1042
      @syedmuneeb1042 2 หลายเดือนก่อน

      @GowthamTirri and can i get ur insta for more help

  • @Gymrat256
    @Gymrat256 2 หลายเดือนก่อน

    Where are you bro? Your tutorials are golden bro. Pls do more and teach us 💪👑

    • @GowthamTirri
      @GowthamTirri 2 หลายเดือนก่อน

      Coming soon..

  • @hannapm1906
    @hannapm1906 2 หลายเดือนก่อน

    I am not able to get responsive background image

  • @gaiety5219
    @gaiety5219 3 หลายเดือนก่อน

    The tutorial is great, but there are a lot of typo errors during the code-along. One minute, you'll type something and come back later to realize that the tutor had a typo error and corrected himself without your knowledge, giving me so many errors and my code not showing what I wanted. But thanks to Chat GPT, the errors from typos were corrected. This video is definitely not for beginners in JS

    • @GiantExplainer
      @GiantExplainer 8 วันที่ผ่านมา

      Hey can you provide me source code

    • @royalstunner1234
      @royalstunner1234 4 วันที่ผ่านมา

      Hlo ​@@GiantExplainer

    • @royalstunner1234
      @royalstunner1234 4 วันที่ผ่านมา

      ​@@GiantExplaineryou get the code

  • @dicksoncyprian9511
    @dicksoncyprian9511 3 หลายเดือนก่อน

    One question Sir,Why you didn't wrapp footer inside <Section> tag

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Footer tag already has a semantic meaning, so wrapping it in a section is unnecessary

  • @dragofanshyperrealisticgaming
    @dragofanshyperrealisticgaming 3 หลายเดือนก่อน

    Really amazing Instructions; had to make one website for my school! Really appreciate your work, keep it up!

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Glad it helped! Thanks for the love!

    • @dragofanshyperrealisticgaming
      @dragofanshyperrealisticgaming 3 หลายเดือนก่อน

      @@GowthamTirri I have a query, I was making the footer of the well first page (home page) like you but all the words are not properly aligned in the middle they are a little to the extreme side of the webpage. Any Idea how I could fix that?

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Send me a screenshot on Instagram, will try to help you out

    • @dragofanshyperrealisticgaming
      @dragofanshyperrealisticgaming 3 หลายเดือนก่อน

      @@GowthamTirri Totally fine! I figured it out in some time.

  • @robertgurano2463
    @robertgurano2463 3 หลายเดือนก่อน

    what apps that u use to inspect the source website

  • @Checkmate-www
    @Checkmate-www 3 หลายเดือนก่อน

    just completed this project all on my own and i learnt many things from this. Appreciate the work brother ..thank you

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      So glad, it helped you. Checkmate!

  • @m23photography8
    @m23photography8 3 หลายเดือนก่อน

    Bro is the var is javascript?

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Yes, the code inside the <script> tag is javascript

  • @AsuLondo
    @AsuLondo 3 หลายเดือนก่อน

    this taught me so much than my teacher lmfao, keep up the great work

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Glad it helped you! Let me know once you finish the project!

  • @ShwetaSingh-xu2zz
    @ShwetaSingh-xu2zz 3 หลายเดือนก่อน

    source code

  • @ANUSHANAIK-ks4ec
    @ANUSHANAIK-ks4ec 3 หลายเดือนก่อน

    Completed😊

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Amazing! Anushka, Share it online.

  • @ENagamani-yl1ub
    @ENagamani-yl1ub 3 หลายเดือนก่อน

    Stats-numbers css property didnt wrote na

    • @GowthamTirri
      @GowthamTirri 3 หลายเดือนก่อน

      Elaborate!

    • @ENagamani-yl1ub
      @ENagamani-yl1ub 3 หลายเดือนก่อน

      Stats-numbers class wrote in html but didnt wrote in css

    • @ENagamani-yl1ub
      @ENagamani-yl1ub 3 หลายเดือนก่อน

      Also numbers is not aligned as u shown

    • @ENagamani-yl1ub
      @ENagamani-yl1ub 3 หลายเดือนก่อน

      :root{ --background: #000430; --secondaryBackground: #171c48; --text: #fff; --purple: #828dff; --teal: #24feee; } *{ margin: 0; padding: 0; box-sizing: border-box; } body{ background-color: var(--background); color: var(--text); } .container{ display: flex; flex-direction: column; align-items: center; justify-content: center; max-width: 500px; margin: 120px auto 0 auto; } .details{ width: 100%; } form{ margin-top: 60px; width: 100%; display: flex; gap: 10px; } input{ padding: 16px; flex: 1; background: var(--secondaryBackground); border: 1px solid var(--purple); border-radius: 10px; outline: none; color: var(--text); } button{ width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: var(--purple); color: var(--text); font-size: 30px; font-weight: bold; } #progress{ width: 50%; height: 10px; background-color: var(--teal); border-radius: 10px; transition: all 0.3s ease; } .stats-container{ padding: 10px; border-radius: 10px; border:2px solid var(--purple); display: flex; justify-content: space-between; gap: 50px; width: 100%; } #progressBar{ width: 100%; height: 10px; background-color: var(--secondaryBackground); border-radius: 5px; margin-top: 20px; } #numbers{ width: 100px; height: 100px;; background-color: var(--purple); display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 30px; font-weight: bold; } can u check once plzz

    • @royalstunner1234
      @royalstunner1234 4 วันที่ผ่านมา

      Hlo code send madri sikidre

  • @mannff93
    @mannff93 4 หลายเดือนก่อน

    Only html css used in this video? I am asking because of Thumbail

    • @Gymrat256
      @Gymrat256 2 หลายเดือนก่อน

      Yes. He is using only html and css

    • @GowthamTirri
      @GowthamTirri 2 หลายเดือนก่อน

      Yes, Js used only for mobile navigation toggle

  • @RudraPatel-w7l
    @RudraPatel-w7l 4 หลายเดือนก่อน

    the video is code is edited between can't you give full code

  • @Lightning_XL
    @Lightning_XL 4 หลายเดือนก่อน

    Theres always that 1 indian dude who clutches on TH-cam. Thanks so much bro🙏🏻🙏🏻

  • @arsolevelsciencenotes230
    @arsolevelsciencenotes230 4 หลายเดือนก่อน

    day 1 10:35

  • @panoskostakus9286
    @panoskostakus9286 4 หลายเดือนก่อน

    so good video sir, thanks for sharing your knowledge.

    • @GowthamTirri
      @GowthamTirri 4 หลายเดือนก่อน

      Thanks for sharing your love ❣️

  • @RoseAndraMaria
    @RoseAndraMaria 4 หลายเดือนก่อน

    I love it! I added something extra myself. <3

  • @Modassarislamk
    @Modassarislamk 5 หลายเดือนก่อน

    Atleast add some demi links to test your site before buying it

    • @GowthamTirri
      @GowthamTirri 5 หลายเดือนก่อน

      It would be same as in the video demo

  • @TheVisualVortex.
    @TheVisualVortex. 5 หลายเดือนก่อน

    Yo bro can you plzz guide how to get that background pictures

    • @HenryBaraka-j1y
      @HenryBaraka-j1y 3 หลายเดือนก่อน

      Just open your tag <img scr="go to chrome website copy an image address paste here" alt="image"> hope it helps

  • @fantoshfantosh
    @fantoshfantosh 5 หลายเดือนก่อน

    thank you sooooooo much very nice

    • @GowthamTirri
      @GowthamTirri 5 หลายเดือนก่อน

      Thanks, Happy coding!

  • @johnjennings8913
    @johnjennings8913 5 หลายเดือนก่อน

    a little to fast for a beginner

  • @musakhan58998
    @musakhan58998 5 หลายเดือนก่อน

    Hi i really like your work you are great. I also want this. Can you please provide source code?

  • @cr7sudarshankc166
    @cr7sudarshankc166 5 หลายเดือนก่อน

    Menu button is not working and mobile -menu also coming without any reason please donnot use to make this websites . it will lose your time 🥲🥲 if u want to get source code u have to paid this is all about marketing and earn money

  • @Marine0101
    @Marine0101 5 หลายเดือนก่อน

    What about its database?

  • @indusstream946
    @indusstream946 5 หลายเดือนก่อน

    Thanks a lot.

    • @GowthamTirri
      @GowthamTirri 5 หลายเดือนก่อน

      Thanks for comment! Subscribe for more.

  • @ifeoluwaaladejebi8027
    @ifeoluwaaladejebi8027 5 หลายเดือนก่อน

    Hey bro I'm having an issue with the mobile menu button, it's not functioning at all, I've followed the steps properly and reviewed my code many times but found no error, pls what should I do? The menu isnt dropping down.

    • @GowthamTirri
      @GowthamTirri 5 หลายเดือนก่อน

      Hey DM me on Instagram, I'll help you with source code

    • @ireol-n9c
      @ireol-n9c 5 หลายเดือนก่อน

      ​@@GowthamTirri Wats ur instagram

  • @Yepitsme-i8
    @Yepitsme-i8 6 หลายเดือนก่อน

    hello I'm following all the steps provided buh i'm not getting the same results. is it because it might have been updated?

    • @GowthamTirri
      @GowthamTirri 5 หลายเดือนก่อน

      You might be missing some nested divs or mis matching class names in html and css files

  • @dskgaming4217
    @dskgaming4217 6 หลายเดือนก่อน

    Ask her out 😂

    • @GowthamTirri
      @GowthamTirri 6 หลายเดือนก่อน

      Haha do it, after finishing this project