html - 更改搜索栏的背景/文本颜色

标签 html css twitter-bootstrap

我的导航栏中有一个搜索栏(使用 Bootstrap):

<li>
    <form class="navbar-search pull-right">
        <input type="text" class="search-query offset1" placeholder="Search">
    </form>
</li>

我想更改默认背景颜色和文本颜色,所以我实现了以下 CSS:

input .search-query {
    background-color:#f47443;
    color:white;
}

但颜色保持不变——黑色和白色。我遗漏的表单/输入背景颜色和字体颜色有什么特别之处吗?

最佳答案

你想要:

input.search-query {
    /* css */
}

JS Fiddle demo .

如果没有空格,它会选择一个 input 元素,它的类是 search-query 用空格分隔术语 input.search-query 浏览器正在 input 元素内部查找具有 search-query 类的 后代 元素。

顺便说一句,你写的选择器:

input .search-query {
    /* css */
}

可能从不匹配任何元素,因为input(和img元素一样)空元素,因为它们不能包含后代元素甚至文本。

引用资料:

关于html - 更改搜索栏的背景/文本颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15297254/

相关文章:

php - WooCommerce 运费计算器 (shipping-calculator.php) - PHP 覆盖 - 仅限邮政编码

html - ie6 隐藏的 div 背景图像直到悬停才显示

javascript - 控制两个div的随机显示

html - 特定元素中的列表框样式(选项)HTML

javascript - 将 HTML 元素的样式属性重置为样式表定义的默认值?

html - 如何更改 Bootstrap 的井颜色?

html - Bootstrap 模态内容扩展过去的模态

html - 如何为背景颜色划分 Bootstrap 容器?

javascript - 突出显示所选菜单项不起作用

html - 显示 : inline-block extra margin