HTML實(shí)現(xiàn)移動(dòng)端固定懸浮半透明搜索框/ 10-17
超酷html5+CSS3綠色發(fā)光搜索框表單提交7KB / 04-22
- 用html5實(shí)現(xiàn)語(yǔ)音搜索框的方法
/ 03-18
分享8款純CSS3實(shí)現(xiàn)的搜索框功能/ 09-14
- CSS 漂亮搜索框美化代碼
/ 12-03
- css 教學(xué)實(shí)例 漂亮的搜索框
/ 10-13
基于html css實(shí)現(xiàn)帶搜索圖標(biāo)的搜索框功能/ 10-09
-
純css實(shí)現(xiàn)的3D立體雞蛋動(dòng)畫(huà)視覺(jué)效果源碼【帶光照與陰影】 CSS特效 / 9KB
-
CSS3炫彩文字動(dòng)畫(huà)背景特效源碼 CSS特效 / 402KB
-
超炫酷CSS3登錄界面動(dòng)態(tài)特效源碼 CSS特效 / 253KB
-
-
CSS3實(shí)現(xiàn)的圣誕老人說(shuō)話表情動(dòng)畫(huà)特效 CSS特效 / 10KB
-
CCS3制作的橙色帶陰影漸變背景傾斜文字特效源碼 CSS特效 / 22KB
-
CSS制作的發(fā)光霓虹效果文字特效源碼 CSS特效 / 115KB
-
-
CSS3實(shí)現(xiàn)鼠標(biāo)懸停名片動(dòng)態(tài)圖文切換特效 CSS特效 / 28.9KB
-
詳情介紹
[code]
<style>
.demo_search {
display:inline-block;
position:relative;
height:27px;
margin:60px;
}
.demo_search:hover {
-webkit-box-shadow:0 0 3px #999;
-moz-box-shadow:0 0 3px #999
}
.demo_search .demo_sinput {
float:left;
width:130px;
height:19px;
line-height:19px;
padding:3px 5px;
border:#A7A7A7 1px solid;
background:white;
color:#888;
font-size:12px;
-webkit-transition:.3s;
-moz-transition:.3s;
outline: none;
}
.demo_search .demo_sinput:focus {
width:200px;
}
.demo_search .demo_sbtn {
cursor:pointer;
height:27px;
font-size:12px;
float:left;
width:50px;
margin-left:-1px;
background:#eee;
display:inline-block;
padding:0 12px;
vertical-align:middle;
border:#A7A7A7 1px solid;
color:#666;
}
.demo_search .demo_sbtn:hover {
background:#ddd;
}</style>
[/code]
2.html代碼:
[code]
<form class="demo_search" action="//www.sharejs.com" method="get">
<input class="demo_sinput" type="text" name="s" />
<input class="demo_sbtn" type="submit" value="搜索" /></form>
[/code]
本范例僅僅使用了CSS3實(shí)現(xiàn),無(wú)需js代碼,可惜的是不能在ie下使用,鄙視ie
下載地址
人氣腳本
相關(guān)文章
-
純css實(shí)現(xiàn)的3D立體雞蛋動(dòng)畫(huà)視覺(jué)效果源碼【帶光照與陰影】
一個(gè)基于純css實(shí)現(xiàn)的3D立體視覺(jué)效果雞蛋動(dòng)畫(huà)源碼,畫(huà)面中的一個(gè)平面上并排豎立著3個(gè)雞蛋,雞蛋呈現(xiàn)出有規(guī)律的左右搖擺動(dòng)作,同時(shí)雞蛋上方有光照在雞蛋上形成反射,下方還有光照...
-
CSS3炫彩文字動(dòng)畫(huà)背景特效源碼
是一段以i love you英文字母為示例制作的炫彩文字動(dòng)畫(huà)效果代碼，字母表面游彩虹色彩流動(dòng)，非常有意思，可以根據(jù)自身需求更換文字，歡迎對(duì)此效果感興趣的朋友前來(lái)下載參考...
-
超炫酷CSS3登錄界面動(dòng)態(tài)特效源碼
利用css3+html5實(shí)現(xiàn)超炫酷的登錄動(dòng)態(tài)頁(yè)面特效，頁(yè)面功能包含有登錄默認(rèn)提示、驗(yàn)證碼，動(dòng)態(tài)登錄成功提示等，炫酷又好用...
-
CSS3實(shí)現(xiàn)的倒計(jì)時(shí)警報(bào)燈樣式特效源碼
CSS3倒計(jì)時(shí)警報(bào)燈樣式代碼是一款基于js跟css3實(shí)現(xiàn)的個(gè)性警報(bào)燈倒計(jì)時(shí)特效，歡迎感興趣的朋友前來(lái)下載參考...
-
CSS3實(shí)現(xiàn)的圣誕老人說(shuō)話表情動(dòng)畫(huà)特效
是一段基于CSS3制作的圣誕節(jié)圣誕老人人物動(dòng)畫(huà)效果代碼，圣誕節(jié)快要來(lái)臨了，感興趣的朋友們可以下載參考...
-
CCS3制作的橙色帶陰影漸變背景傾斜文字特效源碼
是一段基于css3實(shí)現(xiàn)的橙色帶陰影漸變背景傾斜文字效果代碼，網(wǎng)頁(yè)中你可以自己更改編輯，簡(jiǎn)單實(shí)用，歡迎對(duì)此效果感興趣的朋友前來(lái)參考...
下載聲明
☉ 解壓密碼：www.fzitv.net 就是本站主域名，希望大家看清楚，[ 分享碼的獲取方法 ]可以參考這篇文章
☉ 推薦使用 [ 迅雷 ] 下載，使用 [ WinRAR v5 ] 以上版本解壓本站軟件。
☉ 如果這個(gè)軟件總是不能下載的請(qǐng)?jiān)谠u(píng)論中留言,我們會(huì)盡快修復(fù)，謝謝!
☉ 下載本站資源，如果服務(wù)器暫不能下載請(qǐng)過(guò)一段時(shí)間重試!或者多試試幾個(gè)下載地址
☉ 如果遇到什么問(wèn)題，請(qǐng)?jiān)u論留言，我們定會(huì)解決問(wèn)題，謝謝大家支持!
☉ 本站提供的一些商業(yè)軟件是供學(xué)習(xí)研究之用，如用于商業(yè)用途，請(qǐng)購(gòu)買(mǎi)正版。
☉ 本站提供的CSS3實(shí)現(xiàn)的可伸縮搜索框效果(無(wú)js)資源來(lái)源互聯(lián)網(wǎng)，版權(quán)歸該下載資源的合法擁有者所有。