首页 新闻 搜索 专区 学院

html+css搜索小图标问题

0
悬赏园豆:5 [已解决问题] 解决于 2018-08-27 22:45

原代码html样式

<div class="search1">
<form action="" class="searF" method="post">
<input type="search" name="" class="search111" id="" value="小米8" />
<div class="">

<input class="se " value="" type="submit"><i class=" iconfont icon-sousuo"> </i>

<!--<input type="submit" name="" class="se " id="ser" value=" " />-->

</div>
</form>
</div>

css样式

/*搜索框*/
.search1 {
position: relative;
float: left;
width: 356px;
height: 100px;
margin-top: 10px;
}

.searF {
margin-top: 10px;
float: left;
position: relative;
height: 50px;
width: 296px;
}

.search111 {
position: absolute;
margin: 0px;
width: 245px;
height: 50px;
border: 1px solid #e0e0e0;
}

.se {
float: right;
margin: 0px;
line-height: 24px;
width: 52px;
height: 50px;
border: 1px solid #e0e0e0;
background-color: white;
cursor: pointer;
}

图标样式

@font-face {
font-family: "iconfont";
src: url('iconfont.eot?t=1532851887847');
/* IE9*/
src: url('iconfont.eot?t=1532851887847#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('data:application/x-font-woff;charset=utf-8;base64,d09GRgABAAAAAAUcAAsAAAAAB3QAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFZW7kgdY21hcAAAAYAAAABeAAABhpoEBr5nbHlmAAAB4AAAAU0AAAFgtXNlA2hlYWQAAAMwAAAALwAAADYSJnNUaGhlYQAAA2AAAAAcAAAAJAfeA4RobXR4AAADfAAAAAwAAAAMC+kAAGxvY2EAAAOIAAAACAAAAAgAdgCwbWF4cAAAA5AAAAAfAAAAIAESAF1uYW1lAAADsAAAAUUAAAJtPlT+fXBvc3QAAAT4AAAAIwAAADTp8e9/eJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2Bk/sE4gYGVgYOpk+kMAwNDP4RmfM1gxMjBwMDEwMrMgBUEpLmmMDgwVDwzZm7438AQw9zA0AAUZgTJAQAnJQyfeJzFkMENgDAMAy9t6QMxCA9+XYYXc3TirlFMKA8mqCXHimMpUYAFiOIhJrAL48Ep19yPrO4nz2SpEait9K7+U0U0y65BJTMNNm/1H5vXfXT6CnVQJ7byknAD0QcMWwAAeJw1j71Kw1Acxe//XvPR2iZtPpvUtE1icivVgDFtKWK6iKA4CE6OopO0TkIXh3QQHBzMA1hQBIe8Ql9GFB8jGhEPZ/qds/wQg9D3O1mSBpJRF22jfXSCELA9cARsgU2jAPdAtRlVVwRCXWpzrhOQPdAdVtHCQeTrLMeKIEALduxwQANMoR/FeBdCzQIwmuap5K1J5BHKDdq6y4/wC6htd02Mt/LDzbESdmR+VpEkQ5IeeJZheIxXRAGmulZiSmU2f2VEU122N3AbKgY1j8+qnaZ0fh9dW55eAkgSkJsd4W1cN+tFb01NlgyuVuUbZtVdV2D2udqQK5b/gYrgwvWLHOBnpCIbIY/G0A+ACsC1QA8HQ/1XyCtIDMOCCEDiJ8cn2TzJCMmS0UV3wctifjNJCUkn0xTjtLagl6O/eZ4R31lwonyF0+n/5Qc0oT9lAAAAeJxjYGRgYABiAaZelXh+m68M3CwMIHC9efp6BP3/IQsDswSQy8HABBIFAATNCb0AeJxjYGRgYG7438AQw8IAAkCSkQEVMAMARwkCbAQAAAAD6QAABAAAAAAAAAAAdgCweJxjYGRgYGBmCGRgZQABJiDmAkIGhv9gPgMAEPcBcAB4nGWPTU7DMBCFX/oHpBKqqGCH5AViASj9EatuWFRq911036ZOmyqJI8et1ANwHo7ACTgC3IA78EgnmzaWx9+8eWNPANzgBx6O3y33kT1cMjtyDRe4F65TfxBukF+Em2jjVbhF/U3YxzOmwm10YXmD17hi9oR3YQ8dfAjXcI1P4Tr1L+EG+Vu4iTv8CrfQ8erCPuZeV7iNRy/2x1YvnF6p5UHFockikzm/gple75KFrdLqnGtbxCZTg6BfSVOdaVvdU+zXQ+ciFVmTqgmrOkmMyq3Z6tAFG+fyUa8XiR6EJuVYY/62xgKOcQWFJQ6MMUIYZIjK6Og7VWb0r7FDwl57Vj3N53RbFNT/c4UBAvTPXFO6stJ5Ok+BPV8bUnV0K27LnpQ0kV7NSRKyQl7WtlRC6gE2ZVeOEXpc0Yk/KGdI/wAJWm7IAAAAeJxjYGKAAC4G7ICZkYmRmZGFgbGCrTi/tLg0n4EBABbkA0kA') format('woff'), url('iconfont.ttf?t=1532851887847') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+*/
url('iconfont.svg?t=1532851887847#iconfont') format('svg');
/* iOS 4.1- */
}

.iconfont {
font-family: "iconfont" !important;
font-size: 24px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

已经使用源代码了,但我的购物车图标成功了,而这个搜索图标死活不显示

泽峰的主页 泽峰 | 初学一级 | 园豆:48
提问于:2018-07-30 22:17
< >
分享
最佳答案
0

前段用开发者工具调试啊

收获园豆:5
Melody.Gkx | 初学一级 |园豆:196 | 2018-07-31 14:03

就是调试不出来,我才来问的

泽峰 | 园豆:48 (初学一级) | 2018-08-01 20:56
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册