MetInfo搜索条制作

本页面只以最简单示例阐述搜索条的制作，函数标签的详细使用请查阅“标签函数及参数”部分。

简单搜索条

结合CSS控制，可以实现如下效果：

或者

HTML代码：

 
{$metsearch}

css代码：



.headright2{ height:20px; width:590px; float:right; margin:3px 0px 0px 0px; padding:0px 10px 0px 0px; color: #2C2C2C; font-size:13px; 

line-height:20px; text-align:right; } 

.headright2 a{ color:#2C2C2C;} 

.headright2 input{ border:1px solid #999999;}

高级搜索条

结合CSS控制，可以实现如下效果：

HTML代码：



 

$metsearchadv

css代码：



.searchnavright{ width:182px; height:auto; overflow:auto; line-height:25px; text-align:left; padding-left:10px;} 

.searchnavright li{ margin:5px 0px 5px 0px; float:left; list-style:none;} 

.searchnavright li .advsearch_searchword{ width:100px; float:left; margin:2px 8px 0px 0px; list-style:none;} 

.searchnavright li .advsearch_searchword input{ width:100px;} 

.searchnavright font a{color: #666666;} 

.search_input{width:99%; height:30px; text-align:left; margin-top:5px;}

产品及图片含参数搜索条

结合CSS控制，可以实现如下效果：

HTML代码：

 
$metproductsearch

css代码：



.navright1{width:192px; height:auto; overflow:auto; line-height:25px; text-align:left;} 

.navright1 li { list-style:none; float:left; margin:5px 0px 0px 0px; padding:0px 0px 0px 0px; } 

.navright1 li .parasearch_class1{ float:left; text-align:center; padding:0px 0px 0px 30px;} 

.navright1 li .parasearch_class2{ float:left; text-align:center; padding:0px 0px 0px 30px;} 

.navright1 li .parasearch_class3{ float:left; text-align:center; padding:0px 0px 0px 30px;} 

.navright1 li .parasearch_title{ float:left; width:50px; text-align:center;} 

.navright1 li .parasearch_input{ float:left; width:130px;} 

.navright1 li .parasearch_input input{ float:left; width:100px;} 

.navright1 li .parasearch_search{ width:100%; text-align:center;} 

.navright1 li .parasearch_search input{ margin:0px 0px 0px 50px;}

category:MetInfo