特定于页面的CSS规则-放在哪里? [英] Page-specific css rules - where to put them?

问题描述

通常在设计网站时，我需要一种特定的样式才能应用于页面上的特定元素，并且我绝对可以肯定，它只会应用于该页面上的该元素(例如绝对定位的按钮或其他东西).我不想诉诸于内联样式，因为我倾向于同意将样式与标记分开的哲学，因此我发现自己在内部争论放置样式定义的位置.

Often when I'm designing a site, I have a need for a specific style to apply to a specific element on a page and I'm absolutely certain it will only ever apply to that element on that page (such as an absolutely positioned button or something). I don't want to resort to inline styles, as I tend to agree with the philosophy that styles be kept separate from markup, so I find myself debating internally where to put the style definition.

我讨厌为一次性使用场景在基本CSS文件中定义特定的类或ID，并且我讨厌制作特定于页面的.css文件的想法.对于我正在处理的当前站点，我正在考虑仅将样式定义放在页面顶部的head元素中.你会怎么做?

I hate to define a specific class or ID in my base css file for a one-time use scenario, and I dread the idea of making page-specific .css files. For the current site I'm working on, I'm considering just putting the style definition at the top of the page in the head element. What would you do?

推荐答案

查看是否存在可以为您提供所需结果的类组合.您可能还需要考虑将该元素的CSS分解为几个类，然后可以在其他元素上重复使用.这将有助于最大程度地减少整个网站所需的CSS.

Look to see if there's a combination of classes which would give you the result that you want. You might also want to consider breaking up the CSS for that one element into a few classes that could be re-used on other elements. This would help minimize the CSS required for your site as a whole.

在HTML文件顶部，我会尽量避免使用特定于页面的CSS，因为如果您要更改网站的外观，这会使CSS变得支离破碎.

I would try to avoid page-specific CSS at the top the HTML files since that leaves your CSS fragmented in the event that you want to change the appearance of the site.

对于真正不应该用于其他任何地方的CSS，我仍然会在站点范围的CSS中使用 #id 规则.

For CSS which is really, truely, never to be used on anything else, I would still resort to putting a #id rule in the site-wide CSS.

由于CSS是从其他文件链接进来的，因此它允许浏览器缓存该文件，从而为将来的负载(非常)稍微减少了服务器带宽.

Since the CSS is linked in from a different file it allows the browsers to cache that file, which reduces your server bandwidth (very) slightly for future loads.

这篇关于特定于页面的CSS规则-放在哪里?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！