相关疑难解决方法(0)

是否有一个'好'干净的CSS黑客列表,这肯定是面向未来的？

例如,zoom:1安全,只要它只提供给IE,你就会记得它在那里.使用子选择器的常见黑客并不安全,因为IE7支持它们.使用height:1%只是感觉很脏(但可能只是我).

我知道ie7-js,所以IE6的bug不用担心我.此外,我不是在寻找宗教辩论,只是消息来源.

感谢回复 - 我选择了最好的来源作为回答.

还要感谢使用单独的CSS文件的建议,或者不要担心它.我完全同意你的看法,对我来说,这些都是给予的.但是当遇到布局问题时,我想要一个安全的解决方案,这将最大程度地降低我在IE或$ FF + 1中重新审视问题的风险.抱歉,我没有说清楚.

doctype html在顶部使用玉模板.

对于造型input和select:

input, select {
   ...
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
}

input边框半径正确显示,但是select边框显示5px,这是用户代理的值,即使在计算选项卡中调查显示应该应用上述样式的3px.

怎么可能我的风格似乎已被应用,但计算的值和选择的外观与我的风格不符？

请注意,我并没有试图摆脱或替换下拉箭头,我只是想要我的input并且select拥有相同的border-radius,但是input看起来不错,这个奇怪的问题正在发生在select

开发工具清楚地显示5px边界的用户代理被划掉,然而,这是在计算值中显示的值并且明显地应用于元素.

任何提示将不胜感激.

是否可以将 HTML Select 属性设置为更加扁平化？我可以将边框设置为 1px 实线，但下拉部分看起来仍然是 3D 且难看。

我以前使用过jQuery插件Uniform.js,效果很好.

我唯一的问题是它依赖于jQuery.我正在开发一个真正不需要jQuery的项目,而且我不愿意为一个插件加载整个框架.

有没有人知道另一个插件是什么做Uniform做但不依赖任何框架？

我正在尝试在选择选项中更改选择的颜色.我试图这样做:

option::selection {background: #ccc;}
option::-moz-selection {background: #ccc;}
option::-webkit-selection {background: #ccc; color:#fff;}

但它不起作用.这仅适用于简单文本,不适用于选项.有没有办法改变选择的颜色？我不需要改变所选选项的背景.我需要改变选择的颜色.谢谢.

考虑一下这个Bootstrap错误报告.基本上,<select>下拉列表与<select>Chrome和Safari上的元素不一致(两者都只测试了Mac).@mdo认为没有解决办法.我只想要第二个意见.

可以在<select>下拉菜单与基本对齐<select>元素？

实际上我正在尝试<select>使用 CSS设置样式框（没有任何图像作为背景）我的问题是当我在移动设备上查看它时它显示我像一个文本框请指导我如何使它像一个带有 css 的选择框。注意：我不想要 css 中的任何背景图片。

select {
    background: -webkit-linear-gradient(white, #666);
    border: 1px solid #ccc;
    border-radius: 5px;
    color: white;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.8);
    -webkit-appearance: none;
}

当下拉菜单打开或关闭时，如何设置不同的样式？是否有任何伪选择器或技巧？当然没有javascript。

<select>
  <option> op1 </option>
  <option> op2 </option>
</select>

并且 :hover 并不真正适合我的需要，因为当下拉菜单展开时，我可以将光标移开。它仍然是开放的，但 :hover 样式不再适用。

我在选择菜单中遇到了这个问题,它是在CSS和Jquery的帮助下设置它的样式.到现在为止,我设法得到了这个结果,我非常喜欢它:

到目前为止,它在mozila,opera,chrome,IE7 +中都很完美.

这是我目前的来源:

HTML:

            <select class="styled" name="">
                <option>Select title</option>
                <option>Mr.</option>
                <option>Mrs.</option>
                <option>Miss.</option>
            </select>

CSS:

select {
    border: 1px solid #d6d8db;
    background-color: #ecedee;
    text-transform: uppercase;
    color: #47515c;
    padding: 12px 10px 12px 10px;
    width: auto;
    cursor: pointer;
    margin-bottom: 10px;
}
select > option {
    text-transform: uppercase;
    padding: 5px 0px;
}
.customSelect {
    border: 1px solid #d6d8db;
    background-color: #ecedee;
    text-transform: uppercase;
    color: #47515c;
    padding: 12px 10px 12px 10px;
    margin-bottom: 10px;
}
.customSelect.changed {
    background-color: #f0dea4;
}   
.customSelectInner {
    background:url(../images/select_arrows.png) no-repeat center right; …

如何更改选择标记的向下箭头？例:

它现在看起来如何:

我希望如何:

我怎样才能做到这一点？