导航:首页 > 万维百科 > 网页设计搜索窗口代码

网页设计搜索窗口代码

发布时间:2021-03-07 21:37:06

1、网页设计中的站内搜索,用户登录这些需要代码吗?需要的话是些什么代码

不是代码,需要数据库,把网页中的搜索关键词事先放入数据库中,搜索引擎在数据库里面找。

2、如何在网页中实现搜索功能?

有三种常见的方式

1、自己设计表单、编程、与数据库链接检索。

2、在百度或谷歌注册申请站内搜索功能。获得代码,添加到自己的页面中。

3、使用第三方的工具软件,搭建检索功能

下面是制作’PHP搜索’功能
准备:
数据库(mysql):一个数据库(search),库里面一个表(title),表里面一个字段(name).
PHP页面:两个页面(index.php search.php)
制作工具:Dreamweaver

开始:
——————————————————

第一步.创建数据库.(目前大家应该都是用的phpmyadmin来操作数据库的吧?)
建立一个数据库.

第二步.建表
在刚建立的search数据库里插入一个名字为title的表.建表时让你选插入几个字段.写1就可以了.

第三步.建字段
插入的字段命名为name,长度值20就可以了.

—–数据库部分已经做完,接下来是网页部分—–

第四步.建立两个页面
建立两个文件:index.php和search.php可以使用记事本等文本工具直接建立.我使用的工具是Dreamweaver(方便嘛.呵呵).

第五步.index.php的页面制作.
这个页面是用来传递你搜索的关键字的.代码如下:
<form method=”post” action=”search.php” name=”search”>
<input name=”search” type=”text” value=”" size=”15″> <input type=”submit” value=”Search”>
</form>
这段代码是建立一个FORM表单.专门用来提交数据的.
第一行是FORM表单的开始.它的传递方式是post,传递到search.php这个页面.表单名为name.
第二行是文本域和提交按钮.文本域命名为search,按钮默认就可以了.
第三行是FORM表单的结束语句.

第五步.search.php的页面制作.
这个页面很关键.因为他是获取index页面传递过来的值,然后导出搜索的数据.
首先要绑定你建立的search数据库,我用的DW生成的.
上一个页面传送的文本域是search.所以,这里需要建立一个search变量.来接收你输入的关键词.用以下语句定义变量:
<?php
$searchs = $_POST['search'];
?>

然后建立一个记录集,选择高级.SQL语句中填写:
SELECT *

FROM title

WHERE name like ‘%$searchs%’

这句的意思是选择title表里面的所有字段(*),然后查询name中的$searchs变量。这个变量也就是你在index中输入的值啦。

然后在BODY里面绑定一个动态文本。选择NAME。

—–网页部分完成.真个搜索功能也就完成了—–

3、dreamweaver网页制作如何加入搜索框,搜索框功能是可以搜索自已制作的网页中的内容,能做出来吗?谢谢

可以制作搜索框,但是如果要实现实际的搜索功能可能就需要用到后台的内容了。仅仅依靠网页制作,应该是实现不了这个功能的。

4、网页设计 类似百度搜索页面是怎么做出来的

网页设计这个一般都是要求会前端代码,html css js flash 还有些其他的脚本插件什么的。

如果代码写的熟练可以不用DW。写网页的工具很多,用txt文本文档也可以。


好了,贴上搜索框代码,使用需要后台程序支持,直接点了可是什么都没有哦。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>搜索框</title>
<style type="text/css" media="screen">
      body {
        background-color: #f1f1f1;
        margin: 0;
      }
      body,
      input,
      button {
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      }
      .container { margin: 30px auto 40px auto; width: 800px; text-align: center; }

      a { color: #4183c4; text-decoration: none; font-weight: bold; }
      a:hover { text-decoration: underline; }

      h3 { color: #666; }
      ul { list-style: none; padding: 25px 0; }
      li {
        display: inline;
        margin: 10px 50px 10px 0px;
      }
      input[type=text],
      input[type=password] {
        font-size: 13px;
        min-height: 32px;
        margin: 0;
        padding: 7px 8px;
        outline: none;
        color: #333;
        background-color: #fff;
        background-repeat: no-repeat;
        background-position: right center;
        border: 1px solid #ccc;
        border-radius: 3px;
        box-shadow: inset 0 1px 2px rgba(0,0,0,0.075);
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        transition: all 0.15s ease-in;
        -webkit-transition: all 0.15s ease-in 0;
        vertical-align: middle;
      }
      .button {
        position: relative;
        display: inline-block;
        margin: 0;
        padding: 8px 15px;
        font-size: 13px;
        font-weight: bold;
        color: #333;
        text-shadow: 0 1px 0 rgba(255,255,255,0.9);
        white-space: nowrap;
        background-color: #eaeaea;
        background-image: -moz-linear-gradient(#fafafa, #eaeaea);
        background-image: -webkit-linear-gradient(#fafafa, #eaeaea);
        background-image: linear-gradient(#fafafa, #eaeaea);
        background-repeat: repeat-x;
        border-radius: 3px;
        border: 1px solid #ddd;
        border-bottom-color: #c5c5c5;
        box-shadow: 0 1px 3px rgba(0,0,0,.05);
        vertical-align: middle;
        cursor: pointer;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-appearance: none;
      }
      .button:hover,
      .button:active {
        background-position: 0 -15px;
        border-color: #ccc #ccc #b5b5b5;
      }
      .button:active {
        background-color: #dadada;
        border-color: #b5b5b5;
        background-image: none;
        box-shadow: inset 0 3px 5px rgba(0,0,0,.15);
      }
      .button:focus,
      input[type=text]:focus,
      input[type=password]:focus {
        outline: none;
        border-color: #51a7e8;
        box-shadow: inset 0 1px 2px rgba(0,0,0,.075), 0 0 5px rgba(81,167,232,.5);
      }
     
      label[for=search] {
        display: block;
        text-align: left;
      }
      #search label {
        font-weight: 200;
        padding: 5px 0;
      }
      #search input[type=text] {
        font-size: 18px;
        width: 705px;
      }
      #search .button {
        padding: 10px;
        width: 90px;
      }

    </style>
</head>
<body>
<div class="container">
  <div id="search">
    <label for="search"></label>
    <input type="text" name="q">
    <input class="button" type="submit" value="Search">
  </div>
</div>
<div style="text-align:center;margin:100px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>
</body>
</html>

5、html中搜索框怎么做?

<input type="text" class="aa"><input type="button" value="搜索" class="bb">

6、html中搜索框怎么做

.aa{width:100px; height:20px; boder:solid 1px #f00;}//定义搜索框的大小高度以及边框颜色。

思路是:
放大镜图标用个img写进来或者用其它回标签用CSS做背景也可以;
下拉导航答这种效果系统的Select下拉是最容易想到的,但是别想着用它做,,原因很简单,做不到的,,这个必须借助JS辅助来解决!

7、网页设计中如何做一个好看的搜索框

通过from表单,将查询的关键词,通过 like 跟数据进行模糊查询对比
从topics表中查询字段subject与传进来的参数'$_POST['topic']进行比较模糊查询
设subject字段数据为:数学,英语,物理,化学,英文
$subject=$_POST['topic'];
$sql = "select * from topics where subject like '%" .$subject. "%'";
$result = mysql_query($sql);
若从表单提交的‘topic’值为“学”,得到的结果将是:数学,化学
多个字段匹配查询:
$sql = "select id,subject from topics where (id like '%" .$id. "%') or (name like '%" .$name. "%') or (subject like '%" .$subject. "%') order by id desc";

8、用DW制作网页时怎样在页面中加入搜索栏

1、新建一个asp页面,保存为“sousuojieguo.asp”。

2、打开之前制作过的"jiluji.asp“。

3、把鼠标指针放在表格的最左边,按回车键,把鼠标指针往上移,然后点击菜单栏的:插入-->表单-->表单,插入一个表单。

4、在表单里边输入”搜索:“,然后点击菜单栏:插入-->表单-->文本域,插入一个文本框。

5、鼠标点击刚刚插入的文本框,然后在下方把id改成"sousuo"。

6、然后把鼠标放到文本框的后边,插入一个按钮,并把按钮上的显示文字改成"搜索“,切换到刚刚新建的”sousuojiesuo.asp“页面,打开”绑定“面板,点击”+“,选择”记录集(查询)“。

7、在弹出的界面如图所示设置:筛选设置成:xingming-包含-表单变量-sousuo。

8、把鼠标放到搜索结果页面上输入“搜索结果:“,然后回车,在点击菜单栏:插入-->表格。插入一个2行4列的表格。

9、 然后在表格第一行一次输入如图所示文字。

10、然后把绑定面板中刚刚新建的记录集依次拖入表格第二行对应的位置。 


11、把鼠标指针放到第二行的任意位置,然后点击界面下方的<tr>标签,选中第二行。

12、打开”服务器行为“面板,点击”+“,选择”重复区域“。

13、在弹出的界面中选择”所有记录“,然后点击”确定“。

14、切换到”jiluji.asp",把鼠标指针放到搜索框所在表单中,点击界面下方的<form#form1>,选中整个表单。

15、在属性面板中点击动作方框右边的“文件夹”按钮,在弹出的界面中选择”sousuojieguo.asp“。选择完成后,下方的方法选择"post"。

16、保存所有文件,然后按F12就可以在浏览器中浏览效果了。

与网页设计搜索窗口代码相关的知识