weixin_38422826
2017-10-30 09:41搜索栏的搜索标 应该如何实现实际效果。
写的代码如下：
<!DOCTYPE html>
菜鸟教程(runoob.com)
div{ border:2px solid white; height: 50px; border-radius:20px; background:rgb(75,75,75); } ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; border-radius:3px; } li { margin-top:9px; float: left; border-right: 1px solid white; height:35px; } li a { display: inline-block; color: white; text-align: center; padding: 14px 9px; line-height:3px; text-decoration: none; } li a:hover { background-color:rgba(255,255,255,0.5); }
制作的搜索框效果如下：
而我想要的搜索框应该是这样子的：
求大牛指点 应该怎样修改代码达到想要的搜索框效果？
- 点赞
- 回答
- 收藏
- 复制链接分享
2条回答
为你推荐
- thymeleaf实现ifream效果
- spring
- html5
- javascript
- bootstrap
- 2个回答
- 如何使用php创建一个搜索栏输入来搜索表的每一列
- php
- 1个回答
- 搜索android和php中搜索栏的查询作为后端
- web-services
- android
- php
- 1个回答
- 如何隐藏搜索栏以及Wordpress菜单
- html
- wordpress
- search
- php
- 1个回答
- Javascript搜索栏过滤，隐藏/显示在页面上
- angularjs
- javascript
- laravel
- jquery
- php
- 1个回答
换一换