嵌入式内容

独特的样式我有一个将被嵌入到几千个不同的网站的一些HTML标记& CSS样式。我希望本节只使用我自己的样式表，而忽略原始网站的CSS。嵌入式内容

除了使用唯一的前缀的所有类和id的，是那里不是在某些地区适用的网站广泛CSS规则，只有用我自己的造型的方法吗？

来源

2015-04-05 Skarlinski

难道你不能利用样式表的'cascading'部分吗？ 'css'使用规则来确定应该应用哪些样式。添加一个额外的CSS文件到你的页面应该是足够的。 – Stefan 2015-04-05 11:33:43

是否可以链接自己的css文件而不是当前的css文件？ – 2015-04-05 11:37:11

我觉得我不是很清楚，我的代码嵌入别人的网站。我不希望他的规则适用于我的标记。我将重新修改问题 – Skarlinski 2015-04-05 12:00:10

FYI !important声明用户CSS总是会战胜CSS作者和用户代理者（资源：the cascade on Sitepoint），但是这不是你竞争用。

有没有办法仅适用你的CSS，而完全忽视了页面的其余部分，据我所知（在CSS中的C是有原因的;））。但是，不过，这里有一堆应该帮助的东西：

!important是非常强大的。只有其他声明与此修改器有（如有的AS需要的时候不知道，因为它是为那些可怕的HTML电子邮件虽然）仍然适用
同为内联样式机会
id有很强的特异性。与412类和没有id选择器具有较低的特异性比一个与1号和无级（这就是为什么它根据基于它OOCSS和CSS棉短绒是一种不好的做法。情况因人而异）
一个好的技巧，允许人为添加CSS特异性为.c.c { prop:val}：.c {}的特异性的两倍和完全相同的范围。想象一下id;）（你也可以在元素的每个祖先都有一个id，但是你不能在同一元素上有2个id）
initial和unset'd很好，如果它被支持IE浏览器...甚至会更好：all属性，但它的IE11 +，而不是在Safari
所以你必须仔细阅读MDN您要重启并应用它的默认值每个属性。还是在这里SO阅读本惊人回答一个相关的问题：https://stackoverflow.com/a/18464285/137626

不要忘了媒体查询内声明的，可以适用于客户端的网站：您（或您的客户端）将不会看到他们，直到他们调整了他们的浏览器。
我很在意没有一般规则和默认的分辨率，然后具体的人不太多的特殊性，但在一个给定的项目，去年MQ（320或1600+），我真的不关心了，如果它”对我来说更方便（即更快），因为我知道我以后不需要重写它。永远。

编辑：不要忘记考虑假:before和:after。 Normalize.css现在声明为*, *:before, *:after { (-prefix-)box-sizing: border-box }，如果您也使用它们，这可能会令人惊讶。最好不要使用它们，因为它们不能在样式属性中设置样式（与MQ相同的问题）。
消灭任何风格，这些假点可以有，这样的代码：

high-specificity-selector *:before, 
high-specificity-selector *:after { 
    content: none !important 
}

应该足够：没有内容，不假。
/EDIT

如果你对你的项目（数千个网站，哇），你也可以自动测试应用在野外客户的网站的CSS，与测试验证相当严重：

您的小部件的一组元素上的一堆属性的CSS值。资源：http://csste.st/tools/
相较于德初始屏幕截图小工具的渲染强大PhantomCSS（基于CasperJS，本身基于PhantomJS在WebKit的卡斯帕测试，但也有克隆的壁虎/ SlimerJS或IE/TrifleJS测试。）

来源

2015-04-05 14:50:19 FelipeAls

非常感谢您的详细解答。 csste.st链接让人大开眼界。 – Skarlinski 2015-04-07 15:37:23

回答

相关问题