CSS中的attribute()函数和counter()函数可以帮助我们更灵活地控制样式。
attribute()函数可以获取HTML元素的属性值，并将其作为CSS样式的属性值。它的语法如下：
selector {
property: attr(attribute-name);
}其中，selector表示要应用样式的元素选择器，property表示要设置的CSS属性，attribute-name表示要获取的HTML属性名。
例如，我们可以使用attribute()函数来为所有具有data-color属性的元素设置背景色：
[data-color] {
background-color: attr(data-color);
}counter()函数可以获取一个计数器的值，并将其作为CSS样式的属性值。它的语法如下：
selector::before {
content: counter(counter-name);
}其中，selector表示要应用样式的元素选择器，counter-name表示要获取的计数器名。
例如，我们可以使用counter()函数来为列表项添加编号：
ol {
counter-reset: item;
}
li::before {
content: counter(item) ". ";
counter-increment: item;
}这里，我们使用counter-reset属性来定义一个名为item的计数器，并将其初始值设置为0。然后，使用li::before伪元素和content属性来显示计数器的值。最后，使用counter-increment属性来递增计数器的值。
attribute()函数和counter()函数使得我们能够更灵活地控制CSS样式。使用它们可以让我们在样式控制方面有更多的选择和自由。