css3 不重复代码 |css2控制图片大小

首先，大家可以使用CSS3的属性选择器来减少代码的重复性。例如，大家要给所有表格中的单元格都加上边框：

table td {
border: 1px solid black;
}

但是，这样一来就会给表格外的所有单元格都加上边框，所以大家可以使用属性选择器来解决这个问题：

table >tbody >tr >td {
border: 1px solid black;
}

在这个例子中，大家使用了”>”来表示只匹配下一级元素，这样就只会给表格内的单元格加上边框了。

接下来，大家可以使用CSS3的伪类选择器来减少代码重复性。例如，大家要让所有链接在鼠标悬停时都改变颜色：

a:hover {
color: red;
}

这样一来，所有链接在鼠标悬停时都会变成红色。另外，大家还可以使用伪元素选择器来为元素添加一些特殊效果，例如：

p:before {
content: ">>";
}

这个例子中，大家使用了:before来为p元素的前面添加一个“>>”的文本内容，这样就可以在不污染HTML文档的情况下为元素添加一些特殊效果。

最后，大家还可以使用CSS3的 @media 媒体查询来实现不重复代码。例如，大家要让网站在不同的屏幕尺寸下显示不同的样式：

@media screen and (max-width: 768px) {
body {
font-size: 16px;
}
}
@media screen and (min-width: 769px) and (max-width: 1024px) {
body {
font-size: 18px;
}
}
@media screen and (min-width: 1025px) {
body {
font-size: 20px;
}
}

在这个例子中，大家使用了 @media 查询来根据屏幕尺寸来为 body 元素设置不同的字体大小。

总之，CSS3提供了许多不重复代码的方式，大家可以使用属性选择器、伪类选择器、伪元素选择器和 @media查询来实现这一目的。通过巧妙地使用这些技巧，大家可以使得大家的代码更加精简，同时也大大提高了网站的性能。