{{ target: partial-line-border-style }}

{{ if: ${type} === ‘border’ }} #${prefix} borderType(string|number|Array) = ${defaultType|default(“‘solid’”)} {{ elif: ${type} === ‘text’ }} #${prefix} textBorderType(string|number|Array) = ${defaultType|default(“‘solid’”)} {{ else }} #${prefix} type(string|number|Array) = ${defaultType|default(“‘solid’”)} {{ /if }}

{{ if: ${type} === ‘border’ }} ${name}描边类型。 {{ elif: ${type} === ‘text’ }} 文字本身的描边类型。 {{ else }} 线的类型。 {{ /if }}

可选:

  • 'solid'
  • 'dashed'
  • 'dotted'

v5.0.0 开始,也可以是 number 或者 number 数组,用以指定线条的 dash array,配合 {{ if: ${type} === ‘border’ }} borderDashOffset {{ elif: ${type} === ‘text’ }} textBorderDashOffset {{ else }} dashOffset {{ /if }} 可实现更灵活的虚线效果。

例如:

{
	{{ if: ${type} === 'border' }}borderType{{ elif: ${type} === 'text'  }}textBorderType{{ else }}type{{ /if }}: [5, 10],
	{{ if: ${type} === 'border' }}borderDashOffset{{ elif: ${type} === 'text'  }}textBorderDashOffset{{ else }}dashOffset{{ /if }}: 5
}

{{ if: ${type} === ‘border’ }} #${prefix} borderDashOffset(number) = ${defaultDashOffset|default(0)} {{ elif: ${type} === ‘text’ }} #${prefix} textBorderDashOffset(number) = ${defaultDashOffset|default(0)} {{ else }} #${prefix} dashOffset(number) = ${defaultDashOffset|default(0)} {{ /if }}

{{ use: partial-version( version = “5.0.0” ) }}

用于设置虚线的偏移量,可搭配 {{ if: ${type} === ‘border’ }} borderType {{ elif: ${type} === ‘text’ }} textBorderType {{ else }} type {{ /if }} 指定 dash array 实现灵活的虚线效果。

更多详情可以参考 MDN lineDashOffset

{{ if: !${noCap} }}

{{ if: ${type} === ‘border’ }} #${prefix} borderCap(string) = ${defaultCap|default(‘butt’)} {{ else }} #${prefix} cap(string) = ${defaultCap|default(‘butt’)} {{ /if }}

{{ use: partial-version( version = “5.0.0” ) }}

用于指定线段末端的绘制方式,可以是:

  • 'butt': 线段末端以方形结束。
  • 'round': 线段末端以圆形结束。
  • 'square': 线段末端以方形结束,但是增加了一个宽度和线段相同,高度是线段厚度一半的矩形区域。

默认值为 'butt'。 更多详情可以参考 MDN lineCap

{{ /if }}

{{ if: !${noJoin} }}

{{ if: ${type} === ‘border’ }} #${prefix} borderJoin(string) = ${defaultJoin|default(‘bevel’)} {{ else }} #${prefix} join(string) = ${defaultJoin|default(‘bevel’)} {{ /if }}

{{ use: partial-version( version = “5.0.0” ) }}

用于设置2个长度不为0的相连部分(线段,圆弧,曲线)如何连接在一起的属性(长度为0的变形部分,其指定的末端和控制点在同一位置,会被忽略)。

可以是:

  • 'bevel': 在相连部分的末端填充一个额外的以三角形为底的区域, 每个部分都有各自独立的矩形拐角。
  • 'round': 通过填充一个额外的,圆心在相连部分末端的扇形,绘制拐角的形状。 圆角的半径是线段的宽度。
  • 'miter': 通过延伸相连部分的外边缘,使其相交于一点,形成一个额外的菱形区域。这个设置可以通过 {{ if: ${type} === ‘border’ }} borderMiterLimit {{ else }} miterLimit {{ /if }} 属性看到效果。

默认值为 'bevel'。 更多详情可以参考 MDN lineJoin

{{ /if }}

{{ if: !${noMiterLimit} }}

{{ if: ${type} === ‘border’ }} #${prefix} borderMiterLimit(number) = ${defaultMiterLimit|default(10)} {{ else }} #${prefix} miterLimit(number) = ${defaultMiterLimit|default(10)} {{ /if }}

{{ use: partial-version( version = “5.0.0” ) }}

用于设置斜接面限制比例。只有当 {{ if: ${type} === ‘border’ }} borderJoin {{ else }} join {{ /if }} 为 miter 时,{{ if: ${type} === ‘border’ }} borderMiterLimit {{ else }} miterLimit {{ /if }} 才有效。

默认值为 10。负数、0InfinityNaN 均会被忽略。

更多详情可以参考 MDN miterLimit

{{ /if }}