Create glassmorphism using html and css
Hello Everybody.In this Blog we are going to build very beautiful Glassmorphism Using HTML CSS.
Next Create folder in our computer drive.we can give any folder name.
Next right click on folder and click on open with Vs Code.So our project will open in VS Code Editor.
Next click on plus icon and create html or css file.
link our css file in html file using link tag.
Next we will write htm code for display weather in degree of city on our page.
we will use h1 that will display in the right of container and paragraph and location will display in the left or container.
right click on html file and click on open with live server.so our page will open in browser.
Next we will design our page using css.we will give background image for body.
@import url(‘https://fonts.googleapis.com/css2?family=Roboto&display=swap');
Now in body background image will display on page.go to browser and refresh our page.so our page will look like below.
Now we will design our container and so our html text will display in center.
Next go to browser refresh our page so our weather detail will display in center.
Next we will design weather box using css.so our weather will display below look like picture.
Next go to our browser and refresh our page.so our page will look like below.
Next we design our drop div using css so these div will display around our weather box.
Now our page has design completely will look like.
go to browser and check our page.
you can download source code from github repository.
