MetInfo搜索条制作
来自站长百科
导航:返回上一页
本页面只以最简单示例阐述搜索条的制作,函数标签的详细使用请查阅“标签函数及参数”部分。
简单搜索条[ ]
结合CSS控制,可以实现如下效果:
或者
HTML代码:
<!-- EOT; $metsearch=methtml_search(); echo <<<EOT --> <div class="headright2">{$metsearch}</div>
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代码:
<!-- EOT; $metsearchadv=methtml_advsearch(); echo <<<EOT --> <div class="searchnavright">$metsearchadv</div>
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代码:
<!-- EOT; $metproductsearch=methtml_parasearch('product'); echo <<<EOT --> <div class="navright1">$metproductsearch</div>
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;}