漂亮的博客搜索框

看到漂亮的搜索框,收藏...

主要用背景图片和输入框和链接隐藏完成。

可以在IE6+,ff,chorme下兼容...

 2010073014285758.jpg

2010073016464434.png

 

<!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">
/*-----------------------
博客图片搜索框
兼容性:IE6+,ff,chomre
author:tomieric
date:2010-7-30
website:http://cnblogs.com/tomieric
qq微博:http://t.qq.com/tomi-eric
-------------------------*/
#search{ position:relative; width:231px; height:39px; line-height:39px; background:url(search.png)  no-repeat left center;}
#search_text{ height:20px; width:160px; position:absolute; top:8px; left:6px; border:1px solid transparent; color:#aaa}
#search a{ display:block; width:55px; height:26px; text-decoration:none; position:absolute; right:6px; top:6px;text-indent:-1000em/*隐藏链接文字*/}
</style>
<script>
function submit_form(){ //模拟表单提交函数
var keyWords=document.getElementById("search_text").value; //获得搜索框关键字
window.location.href="http://google.com.hk/search?hl=zh-CN&q=tomieric+"+keyWords;  //跳转到搜索页面
return false;
}
</script>
</head>
<body>
<div id="search">
<input type="text" name="text" id="search_text" />
<a href="#" onFocus="this.blur()" οnclick="submit_form()">搜索</a>
</div>
</body>
</html>

 

demo:U115

 

转载于:https://www.cnblogs.com/tomieric/archive/2010/07/30/1788717.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/475908.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LeetCode 863. 二叉树中所有距离为 K 的结点(公共祖先/ DFS+BFS)

文章目录1. 题目2. 解题2.1 公共祖先2.2 建图BFS1. 题目 给定一个二叉树&#xff08;具有根结点 root&#xff09;&#xff0c; 一个目标结点 target &#xff0c;和一个整数值 K 。 返回到目标结点 target 距离为 K 的所有结点的值的列表。 答案可以以任何顺序返回。 示例 …

多线程 流水线 java_Java Lock锁多线程中实现流水线任务

下面程序代码通过使用Lock锁执行简单的流水线任务&#xff1a;import java.util.concurrent.locks.Condition;import java.util.concurrent.locks.Lock;import java.util.concurrent.locks.ReentrantLock;/*** author lzq* data 2020/4/29 0029 - 下午 9:48*/public class Test…

LeetCode 962. 最大宽度坡(单调栈)

1. 题目 给定一个整数数组 A&#xff0c;坡是元组 (i, j)&#xff0c;其中 i < j 且 A[i] < A[j]。这样的坡的宽度为 j - i。 找出 A 中的坡的最大宽度&#xff0c;如果不存在&#xff0c;返回 0 。 示例 1&#xff1a; 输入&#xff1a;[6,0,8,2,1,5] 输出&#xff1…

python 保存文件 吃内存_孤荷凌寒自学python第三十七天python的文件与内存变量之间的序列化与反序列化...

孤荷凌寒自学python第三十七天python的文件与内存变量之间的序列化与反序列化(完整学习过程屏幕记录视频地址在文末&#xff0c;手写笔记在文末)一、什么是序列化与反序列化序列化是指将内存中的数据进行指定规则的格式梳理&#xff0c;使之方便按一定格式保存到文件中。我的理…

【Kaggle】Intermediate Machine Learning(管道+交叉验证)

文章目录4. Pipelines 管道5. Cross-Validation 交叉验证上一篇&#xff1a;【Kaggle】Intermediate Machine Learning&#xff08;缺失值文字特征处理&#xff09; 下一篇&#xff1a;【Kaggle】Intermediate Machine Learning&#xff08;XGBoost Data Leakage&#xff09; …

LeetCode 201. 数字范围按位与(位运算)

文章目录1. 题目2. 解题2.1 按位查找02.2 两数直接都往右移动&#xff0c;直到相等1. 题目 给定范围 [m, n]&#xff0c;其中 0 < m < n < 2147483647&#xff0c;返回此范围内所有数字的按位与&#xff08;包含 m, n 两端点&#xff09;。 示例 1: 输入: [5,7] 输…

编php矩阵求和,PHP二维数组如何求和?

PHP二维数组求和的方法&#xff1a;1、使用array_sum和array_map函数求和1)、PHP7.2以下可用<?php $arr array(0>array(id>1,tol>10),1>array(id>3,tol>12),2>array(id>8,tol>5));//输出tol值的和echo array_sum(array_map(create_function($v…

LeetCode 1311. 获取你好友已观看的视频(BFS+哈希map+vector排序)

1. 题目 有 n 个人&#xff0c;每个人都有一个 0 到 n-1 的唯一 id 。 给你数组 watchedVideos 和 friends &#xff0c;其中 watchedVideos[i] 和 friends[i] 分别表示 id i 的人观看过的视频列表和他的好友列表。 Level 1 的视频包含所有你好友观看过的视频&#xff0c; …

发布ASP.NET程序至IIS7

以前一直和IIS5打交道&#xff0c;后来系统升级到WIN7,自然的就用上了IIS7了&#xff0c;不过因为对IIS7服务器没有系统的了解&#xff0c;所以在自己机子上测试发布网站时&#xff0c;总是遇到各种各样的问题&#xff0c;当时就放弃了&#xff0c;准备有时间再研究的&#xff…

LeetCode 1319. 连通网络的操作次数(BFS/DFS/并查集)

文章目录1. 题目2. 解题2.1 BFS2.2 DFS2.3 并查集1. 题目 用以太网线缆将 n 台计算机连接成一个网络&#xff0c;计算机的编号从 0 到 n-1。 线缆用 connections 表示&#xff0c;其中 connections[i] [a, b] 连接了计算机 a 和 b。 网络中的任何一台计算机都可以通过网络直…

1D機身調焦方法

原文作者&#xff1a;Kent 原文地址&#xff1a;http://www.ldsclub.net/forum/viewthread.php?tid21513&extrapage%3D1&page1另附大兔子調焦心得&#xff1a;http://www.ldsclub.net/forum/viewthread.php?tid28268&extrapage%3D1 需要1.27規格的6角手柄本次轉文…

kdevelop php,KDevelop 5.2开放源代码IDE发布,改进了C ++,PHP和Python支持

KDevelop 5.2近半年的发布&#xff0c;是一个主要的发行版&#xff0c;它在前面版本KDevelop 5.1中实现的Analyzer菜单条目中引入了更多的分析器插件。这些包括Heaprack&#xff0c;一个用C / C 编写的Linux应用程序的堆内存分析器和Cppcheck(一种流行的C 编程语言静态分析器)&…

LeetCode 223. 矩形面积

1. 题目 在二维平面上计算出两个由直线构成的矩形重叠后形成的总面积。 每个矩形由其左下顶点和右上顶点坐标表示&#xff0c;如图所示。 示例: 输入: -3, 0, 3, 4, 0, -1, 9, 2 输出: 45 说明: 假设矩形面积不会超出 int 的范围。来源&#xff1a;力扣&#xff08;LeetCode&…

【Kaggle】Intermediate Machine Learning(XGBoost + Data Leakage)

文章目录6. XGBoost7. Data Leakage 数据泄露上一篇&#xff1a;【Kaggle】Intermediate Machine Learning&#xff08;管道交叉验证&#xff09; 6. XGBoost 参考&#xff1a;《统计学习方法》提升方法&#xff08;Boosting&#xff09; extreme gradient boosting “梯度提…

silverlight(一.安装和新建项目)

1.下载安装silverlight&#xff1a;Microsoft Silverlight™ 3 Tools &#xff08;安装之前需要升级VS2008到SP1&#xff09; 2.和多数人一样我的程序新建好运行调试报错&#xff0c;提示“未安装silverlight托管调试包”&#xff0c;后来我使用VS2010新建的时候提示安装silver…

php webview,Android:控件WebView显示网页 – tinyphp – 博客园

WebView可以使得网页轻松的内嵌到app里&#xff0c;还可以直接跟js相互调用。webview有两个方法&#xff1a;setWebChromeClient 和 setWebClientsetWebClient&#xff1a;主要处理解析&#xff0c;渲染网页等浏览器做的事情setWebChromeClient&#xff1a;辅助WebView处理Java…

LeetCode 207. 课程表(拓扑排序)

1. 题目 你这个学期必须选修 numCourse 门课程&#xff0c;记为 0 到 numCourse-1 。 在选修某些课程之前需要一些先修课程。 例如&#xff0c;想要学习课程 0 &#xff0c;你需要先完成课程 1 &#xff0c;我们用一个匹配来表示他们&#xff1a;[0,1] 给定课程总量以及它们…

php 将颜色透明度,css中如何使颜色透明度

css中使颜色透明度的方法&#xff1a;首先创建一个HTML示例文件&#xff1b;然后创建一个div&#xff1b;最后通过“opacity:0.5;”属性设置元素背景的透明度即可。本教程操作环境&#xff1a;windows7系统、css3、thinkpad t480电脑。CSS颜色透明度一、设置元素背景透明度opac…

php框架laravel百科,PHP 的Laravel 框架

在windows下,搭建PHP的Laravel框架很简单.先把PHP的安装目录 加入到环境变量里(在命令行能访问到php -v 就说明可以了)然后 这些是需求的环境PHP> 7.1.3 (不用说了)OpenSSL PHP扩展(用composer安装器可以自动给你配置的,以下同理,如果没配置,可以自行去php.ini里面把扩展前…

LeetCode 332. 重新安排行程(欧拉路径)

1. 题目 给定一个机票的字符串二维数组 [from, to]&#xff0c;子数组中的两个成员分别表示飞机出发和降落的机场地点&#xff0c;对该行程进行重新规划排序。 所有这些机票都属于一个从JFK&#xff08;肯尼迪国际机场&#xff09;出发的先生&#xff0c;所以该行程必须从 JFK…