We got this video for you so that you don’t need to spend your time in the search.

Learn how to create a transparent drop-down menu with CSS and HTML.

https://clevertechie.com/files/nature.jpg

“ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ ` “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ ` “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ ` “ “ “ “ “ “ “ “ “ “ “ “ “ “ “

(Website) https://clevertechie.com – PHP, JavaScript, WordPress, CSS and HTML tutorials in video and text format with stunning graphics and diagrams.

(YouTube channel) https://www.youtube.com/c/CleverTechieTube

(Google Plus) https://goo.gl/J71p6f – smart techie video tutorials.

(Facebook) https://www.facebook.com/CleverTechie/

(Twitter) https://twitter.com/theclevertechie

“ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ ` “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ ` “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ “ ` “ “ “ “ “ “ “ “ “ “ “ “ “ “ “
Transcript of the video:
hey guys what's going on is smart techie and in this video we're going to learn how to create a transparent navigation menu with CSS and HTML that will look like it go from the front and start right away So I created a new folder and inside folder has this nature as the jpg file you just thought you can use any background you want otherwise you can download this file in the description of this video i'm going to create two new files here index html dot as well as CSS point style and i'm good i'm going to open the files in the text editor of my choice which is netbeans ok so now we are ready to create our navigation menu for HTML i'm going to use opening HTML closing tags right far and then i'll include the stylesheet right away using a link tag with a trap attribute and I will provide r the way where his style is located i'm going to say a rail which is another attribute and i'm going to say stylesheet because we include the style sheet ok so this navigation bar will consist of a bunch of LOL tags and Li which results in an unordered list and list items, so here's what we're going to create let's create the first unordered list and this other list is going to be our main menu when I have some stuff like at home because contact and let sexually add another here called news if this is going to be our main menu let's see what it looks like now by opening it in the browser so you can see that it's just an unordered list pure and impure HTML right now so there is no menu at this point and we will add the style we will add the old style in our style.css but for but first let's go and add all the elements of penny s-menu, so the house is not going to have submenu because it's just a home link, but the item on the list is going to have other submenus. another wants to add another unordered list so let's go and do not hat now and we're fine so for this other list want to have things like our condition and the vision of the team's camps if you just put this that you want for these does not really matter I just want to show you that it's in this Li labeled by making these tabs here ok so you can see that these this Ally we are always in the lie about so you always put inside this element of the list Li because it's going to have all the sub-elements and if I see in a browser Oh, save -First five you in the browser, you can see how these items in the list are actually under the news so these will be our OK submenus so let's do the same thing for things to do I'm in the lily tag I'm just going to copy all these here and then j I'm going to replace those with a lot of other text activities parks shops fix that there just stores and events and go ahead and add more to contact make sure in the list item copy some of these tags already created and I'm going to have to for the contact so map and directions ok let's see what it looks like so far and as you can see it's our complete navigation bar with submenus without any the style so all the HTML content is ready now let's write all the CSS for that ok so that's our HTML code let's start working on CSS ok so let's apply the background image first because that just going to make it look pretty right now I'm using nature that no jpg whatever no-repeat on and for the bottom sighs I'm going to put the cover that will adjust it to the screen of Picture and he'll cover it all for cover r all of the bottom of our web browser and for a family of fonts right now i mean finally airy let's see what it looks like ok, you can see that he added the image background and change the font of the font family or font whatever the font and just change the fund then we will make sure unordered list has no margins or pa dding by putting 20 and also put the style from list to no because we do not want to have kinds of bullets out there so listen you can see that it removes all those bullets and remove the tag and everything else ok let's get back here ok so the

source

We inserted this video based on certain parameters as on date of insertion. Few of them are below.

Video Views: 396665

Video Rating: 4.90


LEAVE A REPLY

Please enter your comment!
Please enter your name here