<form action="http://www.baidu.com/baidu" target="_blank">
<input type="text" name="word" size="60" style="height: 60px;width: 1100px;background-color: #9a9a9a26;">
<input type="submit" value="搜索" style="border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
padding:20px;
height: 60px;width: 80px;
margin-left: 30px;
background-color: #1591ea;
font-size: large;
color: antiquewhite;">
</form>

css里写上:

input[type=text] {
color: #111;
background-color: #c7dec6;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
padding:20px;
}

html如何实现圆角的百度搜索框?的更多相关文章

  1. Ajax以及类似百度搜索框的demo

    public class Ajax01 extends HttpServlet{ @Override protected void service(HttpServletRequest request ...

  2. JavaScript实现模糊推荐的input框(类似百度搜索框)

    如何用JS实现一个类似百度搜索框的输入框呢,再填充完失去焦点时,自动填充配置项,最终效果如下图: 实现很简单,但是易用性会上升一大截,需要用到的有jquery-ui的autocomplete,jque ...

  3. 使用 Vue.js 2.0+ Vue-resource 模仿百度搜索框

    使用 Vue.js 2.0 模仿百度搜索框 <!DOCTYPE html> <html> <head> <meta charset="utf-8&q ...

  4. React实现最完整的百度搜索框

    import React,{Component} from 'react' import ReactDOM,{render} from 'react-dom' import 'bootstrap/di ...

  5. Ajax跨域:Jsonp实例--百度搜索框下拉提示

    Ajax跨域:Jsonp实例--百度搜索框下拉提示 一.总结 一句话总结:a.找好接口:b.用script标签的src引入文件(json数据):c.定义及实现上一步引入文件中的函数 1.如何找到一个网 ...

  6. window系统谷歌浏览器百度搜索框光标不能输入并且不显示光标----自制bug以及解决

    --------------------bug无处不在------------------------- 今天在搞代码的时候,保存文件无意中犯了个致命错误,文件名称写入非法字符,可能与Windows系 ...

  7. JS---DOM---案例:模拟百度搜索框

    模拟百度搜索框 我的思路整理: 1. 注册文本框抬起事件(onkeyup) 2. 处理函数: --->创建临时数组,循环遍历文本框键入的文字内容和keywords数组,用keyWords[i]. ...

  8. 【JavaScript_DOM 百度搜索框】

    今天给大家带来的事一个简单的百度的历史搜索框,大家在搜索东西的时候,百度会自动给你显示你最近搜索过的一些东西,那这个拿js怎么做呢? 我们一起来学习吧 这是一个HTML页面: <!DOCTYPE ...

  9. js实现百度搜索框滑动固定顶部

    现在很多主流系统例如百度.有道.爱奇艺等的搜索框都有一个特点,滑动到刚好看不到搜索框时,固定搜索框到顶部,这也算是一个对用户友好型的操 作. 在看了百度的js和css后自己摸索出来实现效果,还是学艺不 ...

随机推荐

  1. centos7之zabbix的监控H3C ER3200G2流量

    1.首先在服务器端安装snmp工具 yum -y install net-snmp-utils snmp-libs snmp-devel snmp 启动snmpd服务 systemctl start ...

  2. 了解Vue.js

    一.了解Vue (1)Vue.js在设计上采用MVVM(Model-View-ViewModel)模式 当View变化时,会自动更新到ViewModel,反之亦然.View与ViewModel通过双向 ...

  3. macbook 入门

    前面的话 第一次使用 Mac 之前,需要改变一些原有思维,不应该使用 Windows 的思维习惯去使用 Mac,Mac 会节省系统维护.清理杀毒.升级驱动等操作的时间,让我们可以专注做真正重要的事情, ...

  4. Mint-UI组件 MessageBox为prompt 添加判断条件

    Mint-UI 的Message Box 是prompt类型时,可以添加正则判断或者function判断条件.具体可以查看Mint-UI源码. 添加正则判断条件: MessageBox({ $type ...

  5. [PRIMITIVE TECHNOLOGY]澳洲小哥的黑皮豆/black been/摩顿湾板栗(栗子)/Moreton Bay Chestnut

    wiki:https://en.wikipedia.org/wiki/Castanospermum inner:http://blog.sciencenet.cn/blog-309517-770951 ...

  6. redis cluster简介和配置(3)

    前面我介绍了 redis sentinel,既然有了sentinel,为什么还要一个cluster呢?因为随着业务量的增加,不可避免要对redis进行扩容,扩容方式一般由2种:1. 垂直扩容 2. 水 ...

  7. ConcurrentHashMap扩容

    然后,说说精华的部分. Cmap 支持并发扩容,实现方式是,将表拆分,让每个线程处理自己的区间.如下图:     假设总长度是 64 ,每个线程可以分到 16 个桶,各自处理,不会互相影响. 而每个线 ...

  8. 静态网站创建工具Docusaurus

    地址:https://docusaurus.io/docs/zh-CN/installation 安装 Docusaurus

  9. 使用Docker安装SonarQube

    需先安装docker和docker-compose.见:https://www.cnblogs.com/hackyo/p/9280042.html 在任意目录下新建文件docker-compose.y ...

  10. i-83.net quadhost子产品

    i-83.net 6$一年, 首年半价, 优惠码: APR19-NAT50 加拿大 ---------------------------------------------------------- ...