gpt4 book ai didi

html - 外壳内的响应式搜索框和元素

转载 作者:行者123 更新时间:2023-11-28 10:59:00 25 4
gpt4 key购买 nike

我在为移动网站创建具有搜索功能的响应框时遇到问题。我计划在这个网站上添加 jquery 函数,所以我想创建一个外壳,然后在外壳内放入一个独特的 Logo 元素和一个独特的搜索元素。当我运行这段代码时,搜索框出现高度问题。我希望高度具有响应性,而不是静态的。

HTML:

<head>
<meta charset="utf-8">
</head>

<body>

<style type="text/css">
*{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.outer-top{
border: 1px solid black;
}

.logo {
border:1px solid black;
text-align:center;
float:left;
width:25%;
height: 15%;
}
.searchbar {
border:1px solid black;
text-align:center;
float:left;
width:75%;
height:15%;
}

</style>

<div class="outer-top">
<div class="logo">
<p>logo</p>
</div>
<div class="searchbar">
<input type="text" name="search"><input type="submit" value="Search" class="sbutton">
</div>
</div>



</body>
</html>

最佳答案

试试这个

.outer-top{
border: 1px solid black;
height:400px;
}

您的外顶 div 需要指定高度。就我自己而言,我的是 400px

关于html - 外壳内的响应式搜索框和元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22526923/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com