资讯专栏INFORMATION COLUMN

搜索框设置背景图 通过设置placeholder属性添加

kamushin233 / 2144人阅读

摘要:名为的框搜索框添加背景图片

/#keyword/
id名为keyword的input框(搜索框)添加背景图片

#keyword::-webkit-input-placeholder {
    color: transparent;
    text-indent: -9999px;
    background: transparent url(../img/google_custom_search_watermark.gif) no-repeat 10% center;
}
#keyword::-moz-placeholder {
    /* Firefox 19+ */
    color: transparent;
    text-indent: -9999px;
    background: #fff url(../img/google_custom_search_watermark.gif) no-repeat 10% center;
}
#keyword:-moz-placeholder {
    /* Firefox 18- */
    color: transparent;
    text-indent: -9999px;
    background: transparent url(../img/google_custom_search_watermark.gif) no-repeat 10% center;
}
#keyword:-ms-input-placeholder {
    /* IE 10- */
    color: transparent;
    text-indent: -9999px;
    background: transparent url(../img/google_custom_search_watermark.gif) no-repeat 10% center;
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/58927.html

相关文章

  • 搜索设置背景 通过设置placeholder属性添加

    摘要:名为的框搜索框添加背景图片 /#keyword/id名为keyword的input框(搜索框)添加背景图片 #keyword::-webkit-input-placeholder { color: transparent; text-indent: -9999px; background: transparent url(../img/google_custom...

    snowLu 评论0 收藏0
  • placeholder的兼容处理

    摘要:方法一效果预览思路是,首先判断浏览器是否支持属性,如果不支持的话,就遍历所有输入框,获取属性的值填充进输入框作为提示信息,同时字体设置成灰色。 placeholder是HTML5的属性之一,在不同的浏览器( 支持HTML5的现代浏览器 )中会有略微不同的显示效果: 在Chrome( v31.0.1650.63 m)、Firefox( v21.0 )、360安全( v6.3 极速模式 )...

    Sunxb 评论0 收藏0
  • placeholder的兼容处理

    摘要:方法一效果预览思路是,首先判断浏览器是否支持属性,如果不支持的话,就遍历所有输入框,获取属性的值填充进输入框作为提示信息,同时字体设置成灰色。 placeholder是HTML5的属性之一,在不同的浏览器( 支持HTML5的现代浏览器 )中会有略微不同的显示效果: 在Chrome( v31.0.1650.63 m)、Firefox( v21.0 )、360安全( v6.3 极速模式 )...

    beita 评论0 收藏0
  • 网页顶部导航栏加强(分为左右两部分;添加一个不被污染样式的搜索

    摘要:目标中间一段空白把导航栏分为左右两个部分在导航栏上加上一个搜索框,但不被的样式污染。 前置 本文需要对CSS,Vue,ElementUI有基本的了解。 本文以ElementUI提供的导航菜单组件为基础。 本文希望能在此组件基础上实现以下内容: 中间一段空白把导航栏分为左右两个部分 在导航栏上加上一个搜索框,但不被 el-menu-item 的样式污染。 先研究清楚ElementUI...

    yedf 评论0 收藏0
  • iOS开发③UIView

    摘要:用到的文本框的地方很多,比如搜索框用户登录框等。实现年活动指示器出于非活动状态时则会隐藏停止旋转开始旋转示例图步进器的作用是按照约定的步长进行增减操作。表示最小值,表示最大值,表示初始化时的值,表示步长。 UILabel Lable的作用是显示不可编辑的文字。 属性检查器 Text:Label显示的文字 Color:文字的颜色 Font:字体和字号 Alignment:文本的对齐方式...

    luck 评论0 收藏0

发表评论

0条评论

kamushin233

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<