html中搜索框怎么做
4个回答
展开全部
用input标签就行,上午回答了知道里面一个童鞋同样的问题,代码同样给你哈
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Examples</title>
<meta name="description" content="">
<meta name="keywords" content="">
<link href="" rel="stylesheet">
<style type="text/css">
#box{
width: 380px;
margin: 30px auto;
font-family: 'Microsoft YaHei';
font-size: 14px;
}
input{
width: 260px;
border: 1px solid #e2e2e2;
height: 30px;
float: left;
background-image: url(images/search.jpg);
background-repeat: no-repeat;
background-size: 25px;
background-position:5px center;
padding:0 0 0 40px;
}
#search{
width: 78px;
height: 32px;
float: right;
background: black;
color: white;
text-align: center;
line-height: 32px;
cursor: pointer;
}
</style>
</head>
<body>
<div id="box">
<input type="text" name="search" placeholder="请输入关键字">
<div id="search">搜索</div>
</div>
</body>
</html>
展开全部
<input type="text" class="aa"><input type="button" value="搜索" class="bb">
这是一个最简单样式的搜索框,没有很复杂的样式。如果需要设计样式可以根据class="aa"来写样式,.aa{}在括号中添加代码即可,当然这是框的样式,按钮的样式.bb{}在括号中填写代码即可。
其他代码学习的方法:如果有想要学习的代码不知道怎么实现,可以先打开一个有你想学的元素的网页(比如你想学习搜索框就打开里面有搜索框的网页),浏览器都能直接查看代码的,现在很多浏览器可以用开发人员工具查看网页代码结构。默认的快捷键都是F12,或者在想看的HTML元素上点右键——审查元素,然后就可以看到你想要的代码了,看懂学习即可
HTML:超文本标记语言, 标准通用标记语言下的一个应用。“ 超文本 ”就是指页面内可以包含图片、 链接,甚至音乐、 程序等非文字元素。超文本标记语言的结构包括 “头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的 具体内容。
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
.aa{width:100px; height:20px; boder:solid 1px #f00;}//定义搜索框的大小高度以及边框颜色。
思路是:
放大镜图标用个img写进来或者用其它标签用CSS做背景也可以;
下拉导航这种效果系统的Select下拉是最容易想到的,但是别想着用它做,,原因很简单,做不到的,,这个必须借助JS辅助来解决!
思路是:
放大镜图标用个img写进来或者用其它标签用CSS做背景也可以;
下拉导航这种效果系统的Select下拉是最容易想到的,但是别想着用它做,,原因很简单,做不到的,,这个必须借助JS辅助来解决!
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
1
搜索这是一个最简单样式的搜索框,没有很复杂的样式。如果需要设计样式可以根据class="aa"来写样式,.aa{}在括号中添加代码即可,当然这是框的样式,按钮的样式.bb{}在括号中填写代码即可。其他代码学习的方法:如果有想要学习的代码不知道怎么实现,可以先打开一个有你想学的元素的网页(比如你想学习搜索框就打开里面有搜索框的网页),浏览器都能直接查看代码的,现在很多浏览器可以用开发人员工具查看网页代码结构。默认的快捷键都是f12,或者在想看的html元素上点右键——审查元素,然后就可以看到你想要的代码了,看懂学习即可。html:超文本标记语言, 标准通用标记语言下的一个应用。“ 超文本 ”就是指页面内可以包含图片、 链接,甚至音乐、 程序等非文字元素。超文本标记语言的结构包括 “头”部分(英语:head)、和“主体”部分(英语:body),其中“头”部提供关于网页的信息,“主体”部分提供网页的 具体内容。
搜索这是一个最简单样式的搜索框,没有很复杂的样式。如果需要设计样式可以根据class="aa"来写样式,.aa{}在括号中添加代码即可,当然这是框的样式,按钮的样式.bb{}在括号中填写代码即可。其他代码学习的方法:如果有想要学习的代码不知道怎么实现,可以先打开一个有你想学的元素的网页(比如你想学习搜索框就打开里面有搜索框的网页),浏览器都能直接查看代码的,现在很多浏览器可以用开发人员工具查看网页代码结构。默认的快捷键都是f12,或者在想看的html元素上点右键——审查元素,然后就可以看到你想要的代码了,看懂学习即可。html:超文本标记语言, 标准通用标记语言下的一个应用。“ 超文本 ”就是指页面内可以包含图片、 链接,甚至音乐、 程序等非文字元素。超文本标记语言的结构包括 “头”部分(英语:head)、和“主体”部分(英语:body),其中“头”部提供关于网页的信息,“主体”部分提供网页的 具体内容。
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询