我们正在使用Sitecore,内容编辑器正在填写一个富文本框字段。
这个富文本框字段为他们提供了一个选项,可以放入html来更好地控制内容样式。所以他们决定加入一些CSS。
他们提供下面的html和CSS。下面添加与.button
和.button145x28
相关的图片的CSS不起作用。
奇怪的是,当我们使用.cutOffCorner
的背景图像添加图像的方法相同时,它可以正常工作。
我们正试图看看实际工作中会阻止下面的事情。
富文本框控件是来自telerik的asp.net控件。我们使用Sitecore版本6.4.1更新3。
你们中的一些人可能会注意到并不是所有的html都存在,但是如果我可以在下面的链接上显示按钮图像,我很确定我可以让其他人使用它。
<style>
.GenericSignupCallToAction .button a {padding: 6px 20px 10px 22px; border: none; background-image:url('~/media/Images/Content/Register-generic-page/button_off.ashx'); background-repeat: no-repeat; width:auto; text-decoration: none; color:#ffffff; font-weight:bold; font-size:13px;}
.GenericSignupCallToAction .button a:hover {padding: 6px 20px 10px 22px; border: none; background-image:url('~/media/Images/Content/Register-generic-page/button_on.ashx'); background-repeat: no-repeat; width:auto; text-decoration: none; color:#ffffff; font-weight:bold; font-size:13px;}
.GenericSignupCallToAction .button145x28 a {padding: 8px 30px 10px 26px; border: none; background-image:url("~/media/Images/Content/Register-generic-page/button_off_145x28.ashx"); background-repeat: no-repeat; width:auto; text-decoration: none; color:#ffffff; font-weight:bold; font-size:13px;}
.GenericSignupCallToAction .button145x28 a:hover {padding: 8px 30px 10px 26px; border: none; background-image:url("~/media/Images/Content/Register-generic-page/button_on_145x28.ashx"); background-repeat: no-repeat; width:auto; text-decoration: none; color:#ffffff; font-weight:bold; font-size:13px;}
.GenericSignUpCallToAction .cutOffCorner { background-image:url("~/media/Images/Landing-Pages/MyHiFX/corner_left_top.ashx"); position:absolute; top:-1px; left:-1px; background-repeat:no-repeat; height: 14px; width: 12px; }
</style>
<div class="GenericSignUpCallToAction">
<div class="box">
<div class="cutOffCorner">
</div>
<div class="headerText">
<h1>blah</h1><br /><br />
<p>blahblah</p>
</div>
<div class="button">
<a href="somelink" title="Sign Up Now">Proceed</a>
</div>
</div>
</div>
答案 0 :(得分:0)
您可以通过使样式更具体来覆盖样式。
textarea .GenericSignUpCallToAction
比.GenericSignUpCallToAction
更具体。
body .GenericSignUpCallToAction
比大多数其他声明更具体。
请参阅:http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/
答案 1 :(得分:0)
最疯狂的游戏区别:
.GenericSignupCallToAction
应为.GenericSignUpCallToAction
这解决了这个问题。