发一个css比较清爽的写法

要写出比较清爽的 CSS 代码，我们需要遵循以下几个原则：

1. 避免冗余，尽量减少代码的重复。

2. 统一使用缩写属性，如 margin 和 padding 可以使用 margin: 10px 20px 30px 40px; 的方式代替。

3. 注意 CSS 选择器的权重，尽量避免使用过于具体的选择器，以便提高代码的可重用性。

4. 保持结构清晰，让代码易于维护。

下面是两个例子：

示例 1：

假设我们需要给网页中的所有段落设置字体、颜色和边距。

一般来说，我们可能会写出如下代码：

p {
  font-family: Arial, sans-serif;
  color: #333;
  margin-top: 20px;
  margin-right: 10px;
  margin-bottom: 20px;
  margin-left: 10px;
}

但这样的代码有些冗余，可以使用缩写属性来简化：

p {
  font: 14px Arial, sans-serif;
  color: #333;
  margin: 20px 10px;
}

示例 2：

假设我们需要给网页中的所有链接添加样式，并且当鼠标悬停在链接上方时，需要改变链接的颜色。

我们可以写出如下代码：

a {
  color: #0078d7;
  text-decoration: none;
}

a:hover {
  color: #005a9e;
}

这样的代码相对简洁，同时也符合“避免使用过于具体的选择器”这一原则。另外，我们可以将链接的样式设置为单独的类，以便在其他地方复用：

.link {
  color: #0078d7;
  text-decoration: none;
}

.link:hover {
  color: #005a9e;
}

这样，我们在 HTML 中使用 <a> 标签时，只需要添加 class="link" 即可应用链接样式。