html+css 仿百度 搜索框
时间：2023-05-05 04:20:42 阅读：211470 作者：4563
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><style> .searchcon { width: 500px; height: 50px; margin: 100px auto; } .parent { width: 100%; height: 42px; top: 4px; position: relative; } .parent>input:first-of-type { /*输入框高度设置为40px, border占据2px，总高度为cqdzh/ width: 380px; height: 40px; border: 1px solid #ccc; font-size: 16px; outline: none; } .parent>input:first-of-type:focus { border: 1px solid #317ef3; padding-left: 10px; } .parent>input:last-of-type { /*button按钮border并不占据外围大小，设置高度cqdzh/ width: 100px; height: 44px; position: absolute; background: #317ef3; border: 1px solid #317ef3; color: #fff; font-size: 16px; outline: none; }</style><body><div class="searchcon"> <form action="" class="parent"> <input type="text"> <input type="button" value="搜索"> </form></div></body></html>
版权声明：该文观点仅代表作者本人。处理文章：请发送邮件至 三1五14八八95#扣扣.com 举报，一经查实，本站将立刻删除。