web开发的一些材料

刚做一个搜索框时，发现原有的搜索框不是很美观。于是上网搜了下，网上有很多这样的代码，在此记录一下，以便以后查阅。

1.搜索框

　　代码如下：

<title>美观的CSS搜索框</title>
<style type="text/css">
.searchinput{border-right-width: 0px;padding-left: 3px;width: 168px;font-family: arial;float: left;border-top-width: 0px;border-bottom-width: 0px;color: #636365;margin-left: 4px;font-size: 8pt;vertical-align: middle;border-left-width: 0px;margin-right: 3px;
}
.tab_search{border-bottom: #cccccc 1px solid;border-left: #cccccc 1px solid;height: 25px;border-top: #cccccc 1px solid;border-right: #cccccc 1px solid;}
.searchaction{width: 21px;float: left;height: 17px;
}
</style>
<form action="#" name="search">
<table border="0" cellpadding="0" cellspacing="0" class="tab_search"><tr><td>
<input type="text" name="q" title="Search" class="searchinput" id="searchinput" onkeydown="if (event.keyCode==13) {}" onblur="if(this.value=='')value='请输入商品关键字';" onfocus="if(this.value=='请输入商品关键字')value='';" value="请输入商品关键字" size="10"/></td><td><input type="image" width="21" height="17" class="searchaction" onclick="if(document.forms['search'].searchinput.value=='- Search Products -')document.forms['search'].searchinput.value='';" alt="Search" src="data:images/searchbutton.gif" border="0" hspace="2"/></td></tr>
</table>
</form>

其中用到的图片为

转载于:https://www.cnblogs.com/chenkaiadd/archive/2013/04/30/3051951.html

web开发的一些材料相关推荐

web前端开发最佳实践_学习前端Web开发的最佳方法
web前端开发最佳实践为什么要进行网站开发? (Why web development?) Web development is a field that is not going anywhere ...
分享十佳Web开发资源
分享十佳Web开发资源 width="22" height="16" src="http://hits.sinajs.cn/A1/weibosh ...
web项目开发人员配比_我如何找到Web开发人员的第一份工作
web项目开发人员配比 I have always had an interest in coding for the web. I built my first site almost 15 yea ...
web开发方法_确保进入Web开发的最快方法
web开发方法做很多项目. (Do lots of projects.) I'm not kidding, it's really that simple. If you've internaliz ...
ux设计师薪水_我是如何从33岁的博物馆导游变成专业的Web开发人员和UX设计师的：我的…...
ux设计师薪水 by Vered Rekanati Mordechai 由Vered Rekanati Mordechai 从33岁的博物馆导游到专业的Web开发人员和UX设计师的方式:我18个月的编 ...
观光公交削弱_削弱Web开发人员和Internet的7大障碍
观光公交削弱 As a web developer I periodically take a step back from the text editor and look at the lands ...
【JavaEE】进入Web开发的世界-HTML
目录一.HTML 1.1概念篇 1.2工具篇 1.2.1文本类型的标签 1.2.2多媒体标签 1.2.3超链接 1.2.4target 1.2.5表格相关的标签 1.2.6 列表标签 1.2.7表单 ...
101个帮助你成为更好Web开发程序员的技巧
对于像你我这样的开发人员来说,进入IT行业会带来很多挑战和机遇.有很多东西要学习和掌握.我们有React,Vue,Angular和Svelte之类的JavaScript框架.我们有静态站点生成器,即J ...
web开发一定时间没操作_Web开发—明智地投资您的时间
web开发一定时间没操作前言 (Preface) The essay is geared towards beginners, written by a beginner himself, with ...

web开发的一些材料

web开发的一些材料相关推荐

最新文章

热门文章