俗話說,白底黑字。能襯托黑的當然是白,能襯托白的也就是黑了。淘寶店鋪的搜索框和店招是買家進入店鋪第一眼看到的,作為門面,當然要做到醒目。雅典黑高端大氣上檔次,特別適合品牌店鋪,下面就和大家分享一些雅典黑的搜索框店招。
另外,店家們要注意在復制粘貼的時候確保自己的店鋪為淘寶專業版旺鋪,還要將店招高度設置120px,根據自己的需要對鏈接和主題進行調整。
<div style=" width:950px; height:120px; margin:auto; text-align:left; position:relative; background:#000;font-weight:normal; font-size:12px;">
<div style=" height:95px; text-align:center;">
<div style="width:400px; height:60px; line-height:60px; margin:0 auto; padding-top:30px; font-family:arial,微軟雅黑; font-size:28px; font-weight:700; color:#fff; overflow:hidden;">店鋪名稱</div>
</div>
<div style=" width:300px; height:20px; overflow:hidden; padding-left:20px; margin-left:20px; background: url(http://img02.taobaocdn.com/imgextra/i2/1770601599/T2mFNjX.VXXXXXXXXX-1770601599.gif) no-repeat scroll 0 center;">
<div style="position: relative;" class="J_TWidget" data-widget-type="Slide" data-widget-config="{contentCls:mk-110-dz,hasTriggers:false,effect:fade,easing:easeOutStrong,duration:0.3}">
<ul class="mk-110-dz">
<li style="height:20px; line-height:20px; display:block;"><a href="店鋪活動頁面鏈接" _fcksavedurl="店鋪活動頁面鏈接" target="_blank" style="color:#C1C1C1; text-decoration:none;"> 店鋪活動主題</a></li>
</ul>
</div>
</div>
<div style="width:auto; padding:0; border:0; left:auto; top:auto; line-height:inherit; width:175px; line-height:20px; position:absolute; left:auto; top:auto; border:0; padding:0; line-height:inherit; right:20px; bottom:5px;" class="footer-more-trigger sn-simple-logo">
<div style=" width:205px; height:20px; margin-bottom:25px;">
<form method="post" name="SearchForm" target="_blank" action="店鋪鏈接/search.htm">
<input type="hidden" name="userId">
<input type="hidden" name="shopId" value="店鋪ID">
<input type="hidden" name="view_type">
<input type="hidden" name="order_type">
<input type="hidden" name="search" value="y">
<input style=" border:1px solid #ddd; height:19px; width:142px; padding:0 4px;" name="keyword">
<input type="submit" style=" width:19px; height:19px; background:url(http://img02.taobaocdn.com/imgextra/i2/1770601599/T2ZFtlX5VXXXXXXXXX-1770601599.png) no-repeat; border:0; cursor:pointer; overflow:hidden;" value=" ">
</form>
</div>
<div style=" height:20px; line-height:20px;">
<a style="color:#C1C1C1;" target="_blank" href="訂單頁面鏈接" _fcksavedurl="訂單頁面鏈接">我的訂單 |</a>
<a style="color:#C1C1C1; cursor:pointer; line-height:20px; text-indent:0; background:none;" data-sharebtn="{skinType:2,type:shop,key:57988233,comment:好店鋪要分享,pic:,client_id:68,isShowFriend:false}" class="sns-widget">分享店鋪 |</a>
<a style="color:#C1C1C1;" target="_blank" href="收藏店鋪頁面鏈接" _fcksavedurl="收藏店鋪頁面鏈接">收藏本店</a>
</div>
</div>
</div>
.skin-box-bd{ border-top:1px #202020 solid; background-color:#000; height:29px; font-family:12px/1.5 tahoma,arial,Hiragino Sans GB,宋體,sans-serif;}
.skin-box-bd .menu-list{ background:none; width:auto; height:29px;}
.skin-box-bd .menu-list .link{ background:none;border:0;color:#fff;cursor:pointer;height:29px; line-height:29px;}
.skin-box-bd .menu-list .link .popup-icon{ background-image:url(http://img02.taobaocdn.com/imgextra/i2/668899258/T2dEG8Xk0aXXXXXXXX_!!668899258.png);}
.skin-box-bd .popup-content{ background-color:#000;border:0;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);opacity:0.9;}
.skin-box-bd .popup-content .cats-tree .cat-hd-hover{ background-color:#222}
.skin-box-bd .popup-content .cats-tree .cat .cat-hd a{ color:#fff}
.skin-box-bd .popup-content .cats-tree .snd-pop-inner{ background:#222}
.skin-box-bd .popup-content .cats-tree .snd-pop-inner .snd-cat-name:hover{ color:#888}
.skin-box-bd .popup-content .menu-popup-cats .sub-cat .cat-name{ color:#fff}
.skin-box-bd .popup-content .menu-popup-cats .sub-cat-hover{ background-color:#222}
.all-cats{ height:29px; background:none; max-width:none;}
.all-cats .link{ width:168px; background:#141414;border:0;color:#fff;height:29px; line-height:29px; padding:0 10px;}
.skin-box-bd .menu-list .menu{ background:none; border:0; height:29px; line-height:29px;}
.skin-box-bd .menu-list .menu .title{ font-size:14px; color:inherit; height:auto; line-height:inherit; font-weight:inherit;}
.skin-box-bd .all-cats .link .title{ color:inherit;}
.skin-box-bd .all-cats .title{ font-size:inherit; height:29px; line-height:29px; font-weight:inherit; margin-left:10px;}
.skin-box-bd .popup-content .cats-tree .fst-cat{ width:188px; border:0;}
.skin-box-bd .all-cats .link .popup-icon{ width:15px; height:14px; margin:8px 0 0 0; float:right; background:url(http://img02.taobaocdn.com/imgextra/i2/668899258/T2dEG8Xk0aXXXXXXXX_!!668899258.png) no-repeat scroll -200px -8px;}
.skin-box-bd .all-cats-hover .link .popup-icon{ background-position:-220px -8px;}
.skin-box-bd .all-cats-popup{ width:188px; font-family:12px/1.5 tahoma,arial,Hiragino Sans GB,宋體,sans-serif;}
.popup-content .cats-tree .fst-cat-icon{ width:3px; height:3px; background:url(http://img03.taobaocdn.com/imgextra/i3/1770601599/T2EC8uX_hXXXXXXXXX-1770601599.gif) no-repeat scroll 0 -90px #000; display:block; float:left; margin:12px 6px 0 15px; overflow:hidden; position:inherit; right:inherit; top:inherit;}
.popup-content .cats-tree .cat-hd-hover .fst-cat-icon{ background-position:0 -110px;}
.popup-content .cats-tree .fst-cat-name{ display:block;float:left;height:28px;overflow:hidden;width:160px;}
.popup-content .cats-tree .snd-cat-icon{ width:3px; height:3px; background:url(http://img03.taobaocdn.com/imgextra/i3/1770601599/T2EC8uX_hXXXXXXXXX-1770601599.gif) no-repeat scroll 0 -110px #000; display:block; float:left; margin:12px 6px 0 15px; overflow:hidden;}
.skin-box-bd .popup-content .cats-tree .fst-cat .cat-name{ padding:0; font-weight:inherit; line-height:28px;}
.popup-content .cats-tree .snd-cat-name{ width:140px; height:28px; display:block; float:left; overflow:hidden;}
.popup-content .cats-tree .snd-cat-hd{ height:28px; line-height:28px;}
.skin-box-bd .popup-content .cats-tree .fst-cat .snd-pop .snd-cat-hd a{ padding:0; line-height:28px;}
.skin-box-bd .menu-list .menu-selected .link{ background:url(http://img03.taobaocdn.com/imgextra/i3/1770601599/T2EC8uX_hXXXXXXXXX-1770601599.gif) repeat-x scroll 0 -40px;}
.skin-box-bd .menu-list .menu-selected .link .title{ background:none;}
.popup-content .cats-tree .cat .cat-hd .fst-cat-icon{ top:auto;}
.all-cats{width:auto;}
.all-cats .link{width:auto;}
.menu-list{ width:auto;}
.all-cats .link .title{ margin:0 85px 0 10px;}
樂發網超市批發網提供超市貨源信息,超市采購進貨渠道。超市進貨網提供成都食品批發,日用百貨批發信息、微信淘寶網店超市采購信息和超市加盟信息.打造國內超市采購商與批發市場供應廠商搭建網上批發市場平臺,是全國批發市場行業中電子商務權威性網站。
本文來源: 最全的雅典黑搜索框店招模板代碼分享