代码之家 › 专栏 › 技术社区 › Mike

如何覆盖内联样式CSS?

inline-styles css html

Mike · 技术社区 · 9 年前

我试过div[style] 问题是,这不是唯一具有内联样式的元素

HTML

<input class="button cool-button" style="float: right !important color:blue" value="Hello" name="hello">
<input class="button cool-button" style="float: right !important color:blue" value="World" name="hello">
<input class="button cool-button" style="float: right !important  color:blue" value="Submit" name="submit">

我的目标是提交按钮

这就是我试图在外部样式表上覆盖css的方式。。。

input.button .cool-button[style] [value="Submit"] [name="submit"] {
    float: none !important;
}

4 回复 | 直到 9 年前

indubitablee 9 年前

如果您的输入具有 !important 内联样式中的语法,而这将优先于该元素的任何css/样式,因此您无法 float:none .

<input class="button cool-button" style="float: right !important; color:blue" value="Hello" name="hello">

但是,如果您的输入没有 !重要的 ,您可以执行以下操作

input.button.cool-button { 
    float: none !important; 
}

<input class="button cool-button" style="float: right ; color:blue" value="Hello" name="hello">
<input class="button cool-button" style="float: right ; color:blue" value="World" name="hello">
<input class="button cool-button" style="float: right ; color:blue" value="Submit" name="submit">

以及 浮动:无 在css工作表中将覆盖 float: right 是内联的

Ishwor Khanal 8 年前

这只是您需要添加的一个步骤

Element[style].button.cool-button{
float:left !important;
}

以您的案例为例

<input class="button cool-button" style="float: right ; color:blue" value="Hello" name="hello">

创建自定义。css文件,并添加以下代码行

/*To override inline style sheet for 'Input' Element*/

input[style].button.cool-button{
float:left !important;
color:white !important;
}

完全希望它能帮助某人! 非常感谢。干杯 Ishwor Khanal公司

Pavel Gatnar 9 年前

使用额外的扩展名:

input.button.cool-button.right{
  float: right;
}

并添加 right 类,而不是输入标记的样式。

然而,使用 clear: right 以取消浮动。

-1

alex GmonC 6 年前

input.button.cool-button { 
    float: none !important; 
}

我希望这有帮助

推荐文章

Softly · 单选按钮未按预期取值

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Thirumal isireddy · 在导航栏顺风css中,img被扭曲,而不是将元素推到旁边

1 年前

eXor420 · 如何在脚本标记中使用导出的函数?

1 年前

Hadi · 如何在无效和有效输入中选择用于更改样式的psoudo元素(after)

1 年前

IonicMan · 剑道网格在宽度过大时不显示某些列

1 年前

Kernier · 如何将数学公式支持添加到StacksEditor?

1 年前

Md. Ibrahim · CSS网格项溢出小屏幕滚动

1 年前

Arjun V Srivatsa · 如何将系统时区信息分配给javascript中的变量?

1 年前

Akshay mek · Vscode扩展建议不适用于某些文件夹

1 年前