Html 在导航栏中放置搜索栏

你好,， 我想在导航栏（div）内放置一个搜索栏。我无法做到这一点。我附上了一张图片来解释我想要达到什么样的结果。

/*向顶部导航栏添加黑色背景色*/
托普纳夫先生{
溢出：隐藏；
背景色：#e9e9e9；
}
/*设置导航栏内链接的样式*/
.topnav a{
浮动：左；
显示：块；
颜色：黑色；
文本对齐：居中；
填充：14px 16px；
文字装饰：无；
字号：17px；
}
/*更改悬停时链接的颜色*/
.topnav a:悬停{
背景色：#ddd；
颜色：黑色；
}
/*设置“活动”元素的样式以突出显示当前页面*/
.topnav a.active{
背景色：#2196F3；
颜色：白色；
}
/*在导航栏中设置搜索框的样式*/
.topnav输入[类型=文本]{
浮动：对；
填充：6px；
边界：无；
边缘顶部：8px；
右边距：16px；
字号：17px；
}
/*当屏幕宽度小于600px时，垂直堆叠链接和搜索字段，而不是水平堆叠*/
@媒体屏幕和屏幕（最大宽度：600px）{
.topnav a，
.topnav输入[类型=文本]{
浮动：无；
显示：块；
文本对齐：左对齐；
宽度：100%；
保证金：0；
填充：14px；
}
.topnav输入[类型=文本]{
边框：1px实心#ccc；
}
}

---

Hi。您可能想了解如何在stackoverflow.com上提问。请发布您正在使用的HTML和CSS代码？