css式样表的使用基本原则

CSS（Cascading Style Sheets）式样表可以帮助我们在网页中美化文字、排版布局、设置背景、添加动画和交互效果等等。然而，为了使网页样式更加通用，我们应遵守一些基本的使用原则。

/* 声明样式表 */

首先，尽量少使用内联样式表，而是使用外部样式表。这样可以避免多个页面中重复定义样式，也可以减少 HTML 代码中的样式定义，让页面结构更加清晰简洁。

/* 外部样式表 */

其次，选择器的定义要精准。我们应该尽可能精确地定义元素的样式，以防样式影响到其它元素。另外，在多个选择器具有相同样式时，应该给出最短的选择器，避免重复定义。

/* 精准的选择器 */
h1.title {
  font-size: 24px;
}

/* 避免重复定义 */
.title,#title {
  font-size: 24px;
}

另外，一般情况下应该在最上面的样式表中定义最通用的样式，然后再逐步往下定义更具体的样式。这样可以保证样式的层叠顺序正确，且样式的优先级更加清晰。

/* 正确的样式层叠顺序 */
p {
  font-family: Arial,sans-serif;
  font-size: 16px;
}

div p {
  font-size: 18px;
}

/* 错误的样式层叠顺序 */
div p {
  font-size: 18px;
}

p {
  font-family: Arial,sans-serif;
  font-size: 16px;
}

最后，尽量不要使用 !important 来标记样式，因为这种方法会优先级太高，极难覆盖。如果必须使用 !important，应该在使用前充分了解其影响，避免对其他样式产生不必要的影响。

/* 避免过多的 !important */
div {
  font-size: 16px !important;
}

/* 避免对其它样式的影响 */
.container div {
  font-size: 16px !important;
}

遵守 CSS 样式表的基本原则可以帮助我们编写更加清晰、合理的样式表，并且让样式在浏览器中正确解析。