How to create navigation bar with search box?
ฝัง
- เผยแพร่เมื่อ 15 ก.ย. 2024
- How to create a navigation bar with a search box.
More Videos.
=========================
HTML and CSS Navigation Bar with Search Box : • HTML and CSS Navigatio...
Responsive and transparent navigation menus with social media icons : • Responsive and transpa...
Awesome Overlay Signup Form | HTML, CSS and JavaScript: • Awesome Overlay Signup...
Responsive navbar with search box | HTML and CSS: • Responsive navbar wit...
Navigation Bar with Login Form || HTML and CSS: • Navigation Bar with Lo...
CSS Coffee Cup with Stream || HTML and CSS: • CSS Coffee Cup with St...
CSS Background Animation | HTML and CSS : • CSS Background Animati...
CSS Grid Layout | HTML and CSS : • CSS Grid Layout | HTML...
Full Screen Login Form with HTML and CSS : • Full Screen Login Form...
CSS Smoke Text Animation : • CSS Smoke Text Animation
Awesome Animated Search Box using HTML and CSS : • Awesome Animated Searc...
Cool CSS Border Animation On Hover | HTML and CSS: • Cool CSS Border Anima...
3D social media icons with HTML and CSS : • 3D social media icons ...
![[LIVE] : ONE ลุมพินี 79 | คู่เอก "ก้องชัย vs อาเมียร์"](http://i.ytimg.com/vi/WfPSA1A0NHc/mqdefault.jpg)
It's very simple yet it looks so good. You've explained it really well. Thank you for uploading this:))
Yet another excellent job. Nobody does this as good as you
Nice video. Thanks for the post. continue sharing new videos.
Please try to improve videos by specifying the meaning of tags.
it was soo helpful...it seemed so difficult to me before , your code was really simple and nice..thankyou
Thank you for this video... It helped me... Stay safe...
Thanks teacher for your teaching. I can do as you already.
Very nice explain
This was very helpful thanks a lot👍👍👍
Sir excellent this is helpful for me
Thank you
I think it's a valuable video for me. Thank a lot sir....
the auto translator is going crazy with ur accent mate xD ........... nice vid
It brought me spanish (autogenerated)😂😂😂
Good job👍🏻
Excellent
This is very informative. Nicely done brother. Don't listen to those people who are criticizing you because of the way you speak English. Keep it up. It really does not matter. What matters is the information you are sharing. Nicely done once again! Keep it up! Happy new year! Greetings from Anonymous.
thanks bro
This is a good tutorial for beginners. I would love to see you work on more advanced web design i myself have some decent tutos on my channel. I would love your feedback.
the professor so amazing man thanks bossman
life saver brother
Saved. So nice. tnks.
Well done, yes it is simple but amazing..
Very Good dude!
nice video. this is really helpful!!
thank you very very much...
For coding Here you go
Navigation bar and menus with search box
body{
background: skyblue;
margin: 0;
}
.menu{
width: 100%;
background: #142b47;
overflow: auto;
}
.menu ul{
margin: 0;
padding: 0;
list-style: none;
line-height: 60px;
}
.menu li{
float: left;
}
.menu ul li a{
background: #142b47;
text-decoration: none;
width: 130px;
display: block;
text-align: center;
color: #f2f2f2;
font-size: 18px;
font-family: sans-serif;
letter-spacing: 0.5px;
}
.menu li a:hover{
color: #fff;
opacity: 0.5px;
font-size: 19px;
}
.search-form{
margin-top: 15px;
float: right;
margin-right: 100px;
}
input[type=text]{
padding: 7px;
border: none;
font-size: 16px;
font-family: sans-serif;
margin-top: 15px;
}
button{
float: right;
background: orange;
color: white;
border-radius: 0 5px 5px 0;
cursor: pointer;
position: relative;
padding: 7px;
font-family: sans-serif;
border: none;
font-size: 16px;
margin-right: 226px;
margin-top: 15px;
}
Home
Gallary
Event
Feedback
About
Contact
Search
Send me on whatsapp plz 03475149323
Thank you very much!
Nice
Ei there! Can you make a tutorial for footer thanks! Top fan here sir!
U didn't define what is the meaning of those tag
,,,,Only helpful for professional..not for beginners
i am a professional
If you can do a tutorial on how to make the search box function, that would be nice.
Javascript needed
middles section will be. left sidebar plus right sidebar plus footer need. l want you. tnks.
It didnot work for me,even i had copied u r ech and every step
Thanks
this is reaaly helpful! Thank you so much!
dunno if you guys gives a damn but if you're bored like me atm then you can watch pretty much all of the latest series on InstaFlixxer. I've been binge watching with my gf lately =)
@Wallace Matthew yup, I've been watching on instaflixxer for months myself :)
Thank you sooooo much
tnx. nice tutorial.
hey...! how can help to me.plz.how change text size in created menu
Good tutorial.Thank you.
Nice work! I have a question, I downloaded a free HTML scrolling page from online, and had no Navigation bar. I tried to add navigation bar from another existing HTML that I like, but didn’t work the way it should! So is any suggestion on how can be done? As I don’t want to create new one, just want to add it to my new existing webpage! Thank you keep the good work
Please provide your email I will send to you source code
Thank you ! I did send you my email address
please send navigation bar code to my email
"lyricsvius@gmail.com"
How do i take and make it to be able to search my website ? Is there a piece of code OR how do I take and use it to search my site for content?
I understand sir
vary thanks
Please do more vedioes
Sir how to change search box text color
Hi, Jyoti Sharma, You can change here
input[type='text'] {
padding: 7px;
border: none;
font-size: 16px;
color: any color you want.
}
very nice
Thanks Sir,
interesting
great work
Happiness for you and your family
I got exact but in dark blue block color came only half of the page and it's middle have so much sky-blue color gap in that and search button there in end page but middle sky-blue is showing wat to do
very good
can u just press f 12 in the website and copy the html?
guys who see this in 2020 :
- u're savage bro
Gud work 💯❤️
hey how would I move the search bar between home and gallary
Sir ye notepad per banate h
All nevigation bar are stick together what should i do
Web Master how can i publish my search engine?
Why doesn't it work when u click on it
thanks a lot your video was quite useful..
plz keep making such videos
Can u please just post the whole text. It's too hard to follow please!!!
Hi, thank you it worked very well, but how do I highlight the current page I am on? Like for example: I click on the Contact page, and the page button will get a green background or something so I know I am on that particular page. If you could help me with that, thanks!
You have to create different pages and link to menus than you will get desired page when you click it....
Friend it would go through like it suppose this is menu bar.
a href="Menu.html">Menu
In this case you have to make another html file named Menu and place it in the same folder in which the basic html file is.
Hope this works for you.
how can i activate sa search
wtf mine is so different with this even I copied yours 1by1
Good
How to change search box color and radius
Hey what link should i add on the search bar
4:44
it's very lengthy code you could have make even shorter
Thank bro
Welcome
Can u plzz send me source code for hospital management
JB bol na nhi Ata English to ku bol rha h bhai nevigtnnn
Thank you so much Master!! 😍😘
My search button is not in line with the search bar. How can I fix it ?
try pulling the plug out and back in
my search bar is not on my nav bar.
thanx a lot sir
Wtf Sound.. cant understand.. too noise in background >:(
please i need source code
Suppose we click on contact then it should open new page how can we code a for this
if you have already made your contact page for your web then link that file with it .
My code run but layout not fixed
Can you also send me the source code?
calingacionchristinev@gmail.com
i think ap ko code bhi post karna chay bcz code sahi say run nai ho raha
pls provide source code not working for me
अगर इसी के उपर एक logo लगाना हो तो कैसे लगाएं
😀
Thank you for this video
Why you give margin 0 in body section
can u please send the code
Can you provide the code for hospital management software
Life is not that simple bacche
It didn't work for me. I didn't get the blue bar and the search bar was all weird. Help me plz
Please proved your email i will send to you source code...........
is it responsive?
learn javascript
unlock your link so we can download please.
Can share me the code
Are bhaiya ye coding galat mera panne nahi bana
Hello sir
not bad
Maybe i watched the video to see how? ;D
my seach bar get collapse please help me
Please provide your email ..I will send source code
can you pls give me a source code
the person who disliked this great tutorial is a nerd
Hi
Please code is diskipsion box
PLEASE INGLISHA MA MAN