أحدث البرامج التعليمية وتطوير الشبكة
 

SVG خصائص السكتة الدماغية


خصائص السكتة الدماغية SVG

تقدم SVG مجموعة واسعة من الخصائص السكتة الدماغية. في هذا الفصل سوف نلقي نظرة على ما يلي:

  • السكتة الدماغية
  • السكتة الدماغية عرض
  • السكتة الدماغية linecap
  • السكتة الدماغية dasharray

كافة الخصائص السكتة الدماغية يمكن تطبيقها على أي نوع من الخطوط والنصوص والخطوط العريضة لعناصر مثل دائرة.


SVG السكتة الدماغية الملكية

الخاصية السكتة الدماغية تحدد لون الخط، النص أو الخطوط العريضة للعنصر:

عذرا، متصفحك لا يدعم SVG المضمنة.

هنا هو رمز SVG:

مثال

<svg height="80" width="300">
  <g fill="none">
    <path stroke="red" d="M5 20 l215 0" />
    <path stroke="black" d="M5 40 l215 0" />
    <path stroke="blue" d="M5 60 l215 0" />
  </g>
</svg>
انها محاولة لنفسك »

SVG السكتة الدماغية عرض الملكية

تحدد الملكية السكتة الدماغية العرض سمك الخط، النص أو الخطوط العريضة للعنصر:

عذرا، متصفحك لا يدعم SVG المضمنة.

هنا هو رمز SVG:

مثال

<svg height="80" width="300">
  <g fill="none" stroke="black">
    <path stroke-width="2" d="M5 20 l215 0" />
    <path stroke-width="4" d="M5 40 l215 0" />
    <path stroke-width="6" d="M5 60 l215 0" />
  </g>
</svg>
انها محاولة لنفسك »

SVG السكتة الدماغية linecap الملكية

الخاصية السكتة الدماغية linecap وتعرف أنواع مختلفة من النهايات إلى مسار مفتوح:

عذرا، متصفحك لا يدعم SVG المضمنة.

هنا هو رمز SVG:

مثال

<svg height="80" width="300">
  <g fill="none" stroke="black" stroke-width="6">
    <path stroke-linecap="butt" d="M5 20 l215 0" />
    <path stroke-linecap="round" d="M5 40 l215 0" />
    <path stroke-linecap="square" d="M5 60 l215 0" />
  </g>
</svg>
انها محاولة لنفسك »

SVG السكتة الدماغية dasharray الملكية

يتم استخدام الخاصية السكتة الدماغية dasharray لإنشاء خطوط متقطعة:

عذرا، متصفحك لا يدعم SVG المضمنة.

هنا هو رمز SVG:

مثال

<svg height="80" width="300">
  <g fill="none" stroke="black" stroke-width="4">
    <path stroke-dasharray="5,5" d="M5 20 l215 0" />
    <path stroke-dasharray="10,10" d="M5 40 l215 0" />
    <path stroke-dasharray="20,10,5,5,5,10" d="M5 60 l215 0" />
  </g>
</svg>
انها محاولة لنفسك »