Responsive Website Landing Page Design | Title (Creative Nature) - Only Using CSS & HTML

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

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

50% 1

In this tutorial, you can learn how to design a Responsive Website Landing Page Design only using CSS and HTML. The website landing page navigation menu is designed with only using pure CSS and HTML, no javascript used. This landing page title is "Creative Nature" and used color theme is simple and clear. Hope this tutorial will be helpful!
+Like and Subscribe 🔔 for More! ❤️❄️
◾Get This Project Source Codes - / responsive-website-lan...
💙 Become a Member to Get All Source Codes - / codingsnow
✔️ Clear Coding
✔️ Easy to Follow
Hire Me 🔖
-----------------------
∎ Hire me to Fix your project Bugs & Issues - www.buymeacoff...
∎ Hire me to Convert your Figma, PSD, and XD Design to an HTML Website - www.buymeacoff...
∎ Download File Setup - codingsnow.com
∎ Download All Source Files On Patreon - / 43063957
∎ Facebook Page - / codingsnow
∎ Instagram - / coding.snow
∎ Support From Paypal - paypal.me/codi...
Support My Works ❤️❄️
--------------------------------------------
∎ Buymeacoffee - www.buymeacoff...
∎ Patreon - / codingsnow
#Responsive_Website_Landing_Page #Responsive_Website
🎵 Background Music
---------------------------------------
Track: Diviners X Riell - Slow [NCS Release]
Music provided by NoCopyrightSounds.
Watch: • Diviners X Riell - Slo...
Free Download / Stream: ncs.io/Slow
Track: Rival x Cadmium - Seasons (feat. Harley Bird) [NCS Release]
Music provided by NoCopyrightSounds.
Watch: • Rival x Cadmium - Seas...
Free Download / Stream: ncs.io/SeasonsYO
Track: Culture Code - Make Me Move (feat. Karra) [NCS Release]
Music provided by NoCopyrightSounds.
Watch: • Culture Code - Make Me...
Free Download / Stream: ncs.io/makememove

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

26 сен 2024

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист

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

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

@pandalyrics6617 Год назад

i should have known about this channel before 😑 i have wasted time on nonsense videos here on RU-vid and finally I find a pro. maybe you weren't born but created through Html & Css. 😍😍 i appriciate

@114-sejalbharambe6 Год назад

Am I only one who tried it but doesn't run the code as expected

@samwisdomsa 11 месяцев назад

Very wonderful tutorial. Thank you very much!

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

im just new but i already subscribed to you thanks a lot duude!! and also for those who watch this video don't skip the ad!

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

You're welcome! ❤️

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

A tip : you can watch movies on flixzone. Me and my gf have been using them for watching loads of movies recently.

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

@Shepard Anders Yea, I have been using Flixzone for years myself :D

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

@Shepard Anders Yea, I have been using flixzone for months myself =)

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

thanks a lot brother btw where do you download the bg image it's not in the source file???

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

ty, its very helpful for beginners in web developer like me.

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

Glad it was helpful!

@ProgrammingHTML-pf5qe 7 месяцев назад

Impressive this is possible with only html and css. Can this adapt to mobile?

@codebase-tv 2 года назад

Amazing work🔥🔥✨✨✨ Why did the margin right: 0; centralize the checked ~ header navigation a And also why did position absolute move the menu bar to the same direction as close btn

@isyagimichael5625 Год назад

Impressive learning about responsive styles and this was creative

@adinda3482 Год назад

help me, when i click menu button nothing shows up

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

Hi there, amazing tutorial! I use Atom too and I was wondering what style you used, what text style you used and what plugin you used for the preview window, because all three look amazing!

@zahidhossainbhuiyan488 Год назад

if you meant packages by plugin then i will say that since Github is sunsetting atom meaning they have archieved the editor and thus bringing to an end of it's continuous development, that's why atom package management is not working anymore as it's certification has expired. So, it's not possible to install new package anymore in the ordinary way.

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

everyone tell me how to set the background image

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

More power to you 💕💕💕

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

Thank you! ❤❤❤

@brucesmith1754 Год назад

I ran this statement thru ChatGPT and still cant get an answer for what this actually does. Can you please clarify? " #check:checked ~ header .navigation {.........}". Thanks

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

can anyone tell me which song is used in video

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

Thank you very much!

@hardikmekhiya6774 8 месяцев назад

It's very creative ❤

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

great guide, thank you!

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

When i change the image property background it just turns white what could be the problem?

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

Hey first of all thank you, this was really helpful! Secondly, I have a question. How can I change the logo text for an image?

@Shaileshkvr Год назад

Instead text use image tag with src attribute

@edwinloaiza1017 Год назад

@@Shaileshkvr you can change it to what you want but the css must also change to fit correctly.

@falcongold2024 6 месяцев назад

2:00 real video begins here

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

Thanks a lot!

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

I can't understand this code header .navigation a:not(:last-child) anyone know this?

@anameza6393 Год назад

Hola!! Exelente tutorial oye una pregunta como hiciste la imagen

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

thankss, but did you make that image background by yourself ?

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

Thanks so much🍃

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

You're most welcome! ❤️

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

Hi can I ask?? Did the style.css can be use also at another page which mean home, about, service?? Or have to do another style.css to do so?

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

Hi, yes, but it's better if you use a external css file for styling because you can easily link it to any html file.

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

@@CodingSnow ouh okay

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

@@CodingSnow can I ask again how can I add logo png at the header of menu?

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

Cause I don't use word I want to use logo image as my logo header

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

Wow Cool! 😍😍😍

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

Thank you 😊

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

Hey, can anyone please tell me, where can I get that image he used in background?

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

Awesome!!! TQVM!

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

Thank you!

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

Thank you

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

You're welcome ❤️

@tahmidahmed-yt 3 года назад

Wow very help full

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

Glad it helped!

@vama-moddragonnest6828 Год назад

how to add sub menu for this tamplt ?

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

Awesome bro 🙂🙂

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

how can i create a css file in Atom that works with my html?

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

Thanks

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

You're welcome!

@santiagomarinrobles4056 6 месяцев назад

Questiooooon, how can I do that? I mean that I am coding and seeing the changes right away. Can someone tell me, please? I would really appreciate it

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

It's because of the "show preview" option that appears when you right-click on your mouse (in VS Code)

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

It is very help full...👌👌

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

Glad to hear that!

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

Awesome 👌👌👌

@anwaremehemai9495 Год назад

SOOOOOOOOOO GOOD

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

my background in css won't appear

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

really helped, thanks.

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

Glad it was helped!

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

Thank u 😘😘😘😘

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

For some reason, the BG does not show up for me, I tried many ways to get it done, it just doesn't show up (fixed.) also at 17:23, my labels aren't hidden when the page is extended.

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

where did you get the bg image?

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

@@geostorm1o157 I was able to fix the BG issue.

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

@@ISAX16 can you share me the background image ?

@joselima7349 Год назад

How did you fix it? I'm trying for hours but I just Cant make the bg menu show up

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

this is awsome, nice work dude, i didn't get the use of transition-property, i think it do nothing

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

Thank you! ❤️ It is to specify the properties that works with the transition time.

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

Hi! I love your content and quick question is what software application do you code?

@todayanalysis4355 2 месяца назад

vs Code

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

how to download more Bg Images like this?

@amanraj0412 Год назад

which application you are using to code?

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

Wow 😲, amazing design

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

Thanks! 😊

@kiddo4188 Год назад

can i ask what ur clicking to make it look like mobile version in 0:40 sec

@afiatasnim8848 Год назад

right click. then inspect

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

Thank you my friend!

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

Welcome friend!

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

Hi, i did everything as seen in the video but - for some reason my paragraph goes down instead of going from left to right. Any tips on how to fix this?

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

where did you get the background pic?

@Raza327 9 месяцев назад

Have you used media query?

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

Did Anyone tell me where did I can image like this background (Shown in video)

@soniamunawar1621 5 месяцев назад

Apko imge mili ya ni?

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

Lovely❤

@ShaneCurtis1705 Год назад

this isn't a tutorial because you don't actually explain anything

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

how to link in css?

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

nice video

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

I have a problem

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

you should give images download link

@mjkh1523 Год назад

nyc

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

Can you please share me the Img?

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

Can you do material of donation goal in php?

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

I haven't done that kind of one before. but I think it can be done.

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

What is the coding app

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

Visual studio code

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

Hey , how do i download code

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

Nevermind got it

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

We want to hire you as an instructor and technical partner. Please comment if you are interested. Thanks

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

poderia liberar o codigo?

@CaioSantos-ms1rc Год назад

O código desse projeto está no website dele.

@joselima7349 Год назад

Vocês fizeram a página? Por algum motivo sempre que clico no botão de menu ele não apresenta as opções... Caso alguém possa ajudar

@sogo.victor 3 месяца назад

@@joselima7349 tive o mesmo problema, até voltei o video para ver se tinha feito algo de errado mas não entendi ao certo o motivo de não ter funcionado...