如何仅为特定元素恢复用户代理样式表?

时间:2016-06-28 17:08:25

标签: css compass-sass compass

我在网页开发中使用Compass。它有一个reset组件:

  

@import“compass / reset”;

此组件重置用户代理样式表,任何标题标记<h1>Hello, World</h1>都会像普通<span>一样呈现文本。以下是Compass重置的方法:

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

但是,我想仅为标头h(1-5)启用用户代理样式表。当前的Web /浏览器标准/功能是否有这样的选择?

1 个答案:

答案 0 :(得分:0)

这实际上是CSS重置的全部目的;它会使元素变平,因此重置后应用的所有样式在浏览器中看起来都相似,并减少了需要编写的CSS数量,以提供相同的外观。

CSS重置可能不是你所追求的,你可能需要一个CSS normalize

希望有人为normalize.css,which you can find here开发了Compass插件,并附有详细的安装说明。

安装宝石并要求config.rb文件上的库后,您可以导入normalize.css的各个部分

因此,如果您要对除<H1> - <H6>标记之外的所有内容进行规范化,则可以从SASS / SCSS文件导入所有内容@import 'normalize/typography';

@import 'normalize/html5';
@import 'normalize/base';
@import 'normalize/links';
@import 'normalize/embeds';
@import 'normalize/groups';
@import 'normalize/forms';
@import 'normalize/tables';

这将是最可重复使用且更清洁的方式。但是,如果您严格需要reset.css,我可以向您推荐的所有其他浏览器默认设置是在单独的文件中创建您自己的reset.css,取出您不希望重置的标签,然后将其导入主SASS / SCSS文件。