CSS导数的作用在于可以帮助大家快速地调整样式属性的值而不必手动去计算它们的增量。它的语法如下：
property: value; /*原始样式*/property: value1+/-value2; /*导数样式*/其中，+/-表示增加或减少的符号，value2表示对原始样式中value的增加或减少的值。
CSS导数的应用
CSS导数可以在很多场景中使用，比如在实现响应式布局时，大家需要控制元素的宽度，因此可以写出如下的代码：
@media screen and (max-width: 767px) {.box {width: 90%; /*原始样式*/width: calc(100% - 20px); /*导数样式*/}}这里的导数样式可以自动计算出原始样式中的width值减去20px后的值，从而达到不同屏幕尺寸下，元素宽度的适配。此外，导数还可以用于字体大小、行高、边距等属性值的调整。
CSS导数的注意事项
虽然CSS导数在开发中很实用，但是大家也需要注意以下几点：
1.兼容性问题：部分浏览器可能不支持calc()函数、+/-符号等。因此，大家需要在使用前先进行测试。
2.层级问题：当在嵌套的元素中使用导数样式时，需要留意导数样式的层级问题，确认它作用的目标元素与原始样式一致。
3.计算误差问题：由于计算机中浮点数的运算精度存在误差，因此在使用导数样式计算时，需要注意输出值是否符合预期。