عرض مصدر CSS/animation-name

<noinclude>{{DISPLAYTITLE:الخاصية <code>animation-name</code>}}</noinclude>
الخاصية <code>animation-name</code> في CSS تستعمل لتحديد أسماء الحركات التي ستُطبَّق على العنصر، وكل اسم يجب أن يُشير إلى قاعدة ‎<code>[[CSS/@keyframes|@keyframes]]</code> التي تُعرِّف قيم الخاصيات اللازمة للحركة.

== بطاقة الخاصية ==
{| class="wikitable" style="width: 100%;"
|-
! scope="row" style="width: 20%;" |[[CSS/initial value|القيمة الابتدائية]]
|<code>none</code>
|-
! scope="row" |تُطبَّق على
|جميع العناصر.
|-
! scope="row" |قابلة للوراثة
|لا
|-
!قابلة للتحريك
|لا
|-
! scope="row" |القيمة المحسوبة
|كما حُدِّدَت.
|}

من الشائع استخدام الخاصية المختصرة <code>[[CSS/animation|animation]]</code> لضبط جميع خاصيات الحركات بآنٍ واحد.<nowiki/><syntaxhighlight lang="css">
/* حركة واحدة */
animation-name: none;
animation-name: test_05;
animation-name: -specific;
animation-name: sliding-vertically;

/* عدِّة حركات */
animation-name: test1, animation4;
animation-name: none, -moz-specific, sliding;

/* القيم العامة */
animation-name: initial
animation-name: inherit
animation-name: unset
</syntaxhighlight>

== دعم المتصفحات ==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
! الدعم الأساسي
|4.0 (مع السابقة <code>-webkit-</code>)
43.0
|5.0 (مع السابقة <code>-moz-</code>)
16.0
|10
|15.0 (مع السابقة <code>-webkit-</code>)
30.0
|5.1 (مع السابقة <code>-webkit-</code>)
9.0
|}
== البنية العامة ==
تقبل الخاصية <code>animation-name</code> قيمةً واحدةً أو أكثر تُشير إلى قاعدة ‎<code>[[CSS/@keyframes|@keyframes]]</code> التي تُعرِّف الخاصيات اللازمة للحركة.

===  <code>none</code> ===
كلمة محجوزة خاصة تعني أنَّه لا توجد إطارات مفتاحية للحركة، وتستعمل لتعطيل الحركة. 

===  <code><keyframes-name></code> ===
أسماء تُشير إلى قواعد ‎<code>[[CSS/@keyframes|@keyframes]]</code> التي تُعرِّف الخاصيات اللازمة للحركة. يمكن أن تكون من نوع البيانات <code>[[CSS/custom-ident|<custom-ident>]]</code> أو سلاسل نصية <code>[[CSS/string|<string>]]</code>.

=== البنية الرسمية ===
<syntaxhighlight lang="css">
animation-name: [ none | <keyframes-name> ]#;

</syntaxhighlight>حيث:<syntaxhighlight lang="css">
<keyframes-name> = <custom-ident> | <string>

</syntaxhighlight>

== مصادر ومواصفات ==
* مسودة [https://drafts.csswg.org/css-animations/#animation-name CSS Animations]. 
[[تصنيف:CSS|{{SUBPAGENAME}}]]
[[تصنيف:CSS Property|{{SUBPAGENAME}}]]
[[تصنيف:CSS Animations|{{SUBPAGENAME}}]]