这篇文章将讨论在HTML中使用CSS延迟属性。延迟属性被用作两个不同属性的子部分，它们是过渡和动画属性。在这两个属性中，被分配到的元素都会发生一些转变。在这个转换过程中，延迟属性可以用来在一定时间内停止转换。现在，我们将为这个属性实现几个例子。
例子1：使用样式标签的方法在div上延迟转换宽度
在这个例子中，我们将使用延迟属性，用样式标签的方法对一个div元素进行宽度转换。过渡-延迟属性将应用于一个div，过渡将在该div的宽度上发生。
在这个脚本中，我们将从文件的头部开始。我们将打开样式标签，并为该标签中的div元素创建一个样式类。在这个样式类中，我们将为div的默认尺寸添加高度和宽度。之后，我们将在宽度上添加过渡属性，把它作为一个关键字。然后，我们将以秒为单位定义过渡时间。在这个标签的最后，我们还将通过给它一个以秒为单位的值来定义过渡延迟约束。
之后，我们将继承这个类的悬停功能，在这个类中我们将添加宽度属性，它将在之前的设置基础上增加，并在 div 被悬停时激活。宽度的变化将由过渡属性管理，包括过渡-延迟属性，它将决定这一过渡的时间间隔。然后，我们将结束样式属性并关闭样式标签，向文件的主体移动。我们将在body标签中使用 h1标签给页面一个标题。在这之后，我们将通过一个div标签添加一个div元素，在这里我们将不添加任何值，因为它都是在文件头的style标签中定义的。
第一个片段显示，该div处于默认阶段。悬停在该 div 上后，将根据样式标签中定义的属性发生过渡，可在第二个片段中看到。
示例 2：使用样式标签方法在 div 的高度上实现过渡延迟
在这个例子中，我们将使用延迟属性，用样式标签技术对一个div元素进行垂直过渡。
我们将从这个脚本中的文件头开始。我们将在这个标签中打开样式标签，并为这个div元素建立一个样式类。在这个样式类中，我们将为div的默认尺寸添加高度和宽度。在这之后，我们将使用一个关键字来为div的高度添加过渡属性。然后，在这个标签之后，我们将定义以秒为单位的过渡时间和过渡延迟约束，为它提供一个以秒为单位的值。我们将继承这个类的悬停功能，并添加高度属性，它将从先前的值中增加，并在div悬停后激活。这种高度的变化将由过渡属性来管理，其中包括过渡-延迟属性，并决定这种过渡的时间间隔。
之后，我们将在body中添加一个带有div标签的div元素。然后将通过关闭所有的标签来关闭文件。
第一个输出显示，该div处于默认状态。当我们将鼠标悬停在它上面时，会根据样式标签中提供的属性发生转换，显示在第二个输出中。
示例 3：使用样式标签方法在 div 的顶面进行动画延迟
在这个例子中，我们将利用延迟属性，同时采用样式标签的方法，从顶部对一个 div 元素进行动画。
在这个脚本中，我们将从文件的标题开始。我们将打开样式标签，为这个标签中的div元素创建一个样式类。我们将在这个样式类中为div的默认尺寸添加高度和宽度。在这之后，我们将使用一个关键字来添加div的动画属性。然后，在这个标签的末尾，我们将提供以秒为单位的动画时间，并通过提供一个以秒为单位的值来限制过渡延迟。我们将为动画制作一个新的类，并为DIV的顶部添加一个尺寸属性，该属性将从先前的值中增加，并在延迟期过后激活。
过渡属性将控制动画，包括animation-delay属性，它控制动画开始前的时间间隔。然后，样式属性将被删除，样式标签将被关闭，使我们能够进入文件的主体。我们将添加一个带有 div 标签的 div 元素，但没有值，因为一切都在文件的样式标签中定义。
第一个输出显示，该div处于默认位置。当animation-delay时间结束时，动画会根据style标签中提供的属性发生，如第二个输出所示。
示例 4：使用样式标签的方法在 div 的左侧进行动画延时
在这个例子中，我们将结合使用延迟属性和样式标签方法，从左侧对一个 div 元素进行动画。
在这个脚本中，我们将从文件的标题开始。我们将打开style标签，为这个标签中的div元素创建一个样式类。我们将在这个样式类中为div的默认尺寸添加高度和宽度。在这之后，我们将使用一个关键字来添加div的动画属性。然后，在这个标签的末尾，我们将提供以秒为单位的动画时间，并通过提供一个以秒为单位的值来限制过渡延迟。
我们将为动画制作一个新的类，并为DIV的顶部添加一个尺寸属性，该属性将从先前的值中增加，并在延迟期过后激活。过渡属性将控制动画，包括animation-delay属性，它控制动画开始前的时间间隔。然后，样式属性将被删除，样式标签将被关闭，使我们能够进入文件的主体。我们将添加一个带有 div 标签的 div 元素，但没有值，因为一切都在文件的样式标签中定义。
这个div处于其默认位置，如第一个结果所示。在animation-delay计时器过后，动画根据style标签中指定的参数发生，如第二个输出所示。
总结
在这篇文章中，我们讨论了在超文本标记语言中使用CSS的延迟属性。延迟属性通常与CSS的过渡和动画属性一起使用。这个属性被用作动画和过渡属性的一个子属性，它有助于定义各个属性的延迟。我们在Notepad++环境中用延迟属性作为子属性来实现这些属性。
