为什么路径的第n个子路径不可访问

Question

我的svg代码是

<svg id= "logo" width="918" height="114" viewBox="0 0 918 114" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="path-1-outside-1" maskUnits="userSpaceOnUse" x="0.0880127" y="0.47998" width="918" height="113" fill="black">
<rect fill="white" x="0.0880127" y="0.47998" width="918" height="113"/>
<path d="M84 107H70.896L18.192 27.08V107H5.08801V6.48798H18.192L70.896 86.264V6.48798H84V107Z"/>
<path d="M119.442 17.288V50.84H156.018V61.64H119.442V96.2H160.338V107H106.338V6.48798H160.338V17.288H119.442Z"/>
<path d="M211.414 6.63198C222.358 6.63198 231.814 8.69598 239.782 12.824C247.846 16.856 253.99 22.664 258.214 30.248C262.534 37.832 264.694 46.76 264.694 57.032C264.694 67.304 262.534 76.232 258.214 83.816C253.99 91.304 247.846 97.064 239.782 101.096C231.814 105.032 222.358 107 211.414 107H180.166V6.63198H211.414ZM211.414 96.2C224.374 96.2 234.262 92.792 241.078 85.976C247.894 79.064 251.302 69.416 251.302 57.032C251.302 44.552 247.846 34.808 240.934 27.8C234.118 20.792 224.278 17.288 211.414 17.288H193.27V96.2H211.414Z"/>
<path d="M295.083 6.63198V107H281.979V6.63198H295.083Z"/>
<path d="M376.744 84.68H332.968L324.904 107H311.08L347.368 7.20798H362.488L398.632 107H384.808L376.744 84.68ZM373 74.024L354.856 23.336L336.712 74.024H373Z"/>
<path d="M493.359 107H480.255L427.551 27.08V107H414.447V6.48798H427.551L480.255 86.264V6.48798H493.359V107Z"/>
<path d="M604.344 55.304C607.992 55.88 611.304 57.368 614.28 59.768C617.352 62.168 619.752 65.144 621.48 68.696C623.304 72.248 624.216 76.04 624.216 80.072C624.216 85.16 622.92 89.768 620.328 93.896C617.736 97.928 613.944 101.144 608.952 103.544C604.056 105.848 598.248 107 591.528 107H554.088V6.63198H590.088C596.904 6.63198 602.712 7.78398 607.512 10.088C612.312 12.296 615.912 15.32 618.312 19.16C620.712 23 621.912 27.32 621.912 32.12C621.912 38.072 620.28 43.016 617.016 46.952C613.848 50.792 609.624 53.576 604.344 55.304ZM567.192 49.976H589.224C595.368 49.976 600.12 48.536 603.48 45.656C606.84 42.776 608.52 38.792 608.52 33.704C608.52 28.616 606.84 24.632 603.48 21.752C600.12 18.872 595.272 17.432 588.936 17.432H567.192V49.976ZM590.376 96.2C596.904 96.2 601.992 94.664 605.64 91.592C609.288 88.52 611.112 84.248 611.112 78.776C611.112 73.208 609.192 68.84 605.352 65.672C601.512 62.408 596.376 60.776 589.944 60.776H567.192V96.2H590.376Z"/>
<path d="M655.505 96.344H690.641V107H642.401V6.63198H655.505V96.344Z"/>
<path d="M750.061 108.008C740.749 108.008 732.253 105.848 724.573 101.528C716.893 97.112 710.797 91.016 706.285 83.24C701.869 75.368 699.661 66.536 699.661 56.744C699.661 46.952 701.869 38.168 706.285 30.392C710.797 22.52 716.893 16.424 724.573 12.104C732.253 7.68798 740.749 5.47998 750.061 5.47998C759.469 5.47998 768.013 7.68798 775.693 12.104C783.373 16.424 789.421 22.472 793.837 30.248C798.253 38.024 800.461 46.856 800.461 56.744C800.461 66.632 798.253 75.464 793.837 83.24C789.421 91.016 783.373 97.112 775.693 101.528C768.013 105.848 759.469 108.008 750.061 108.008ZM750.061 96.632C757.069 96.632 763.357 95 768.925 91.736C774.589 88.472 779.005 83.816 782.173 77.768C785.437 71.72 787.069 64.712 787.069 56.744C787.069 48.68 785.437 41.672 782.173 35.72C779.005 29.672 774.637 25.016 769.069 21.752C763.501 18.488 757.165 16.856 750.061 16.856C742.957 16.856 736.621 18.488 731.053 21.752C725.485 25.016 721.069 29.672 717.805 35.72C714.637 41.672 713.053 48.68 713.053 56.744C713.053 64.712 714.637 71.72 717.805 77.768C721.069 83.816 725.485 88.472 731.053 91.736C736.717 95 743.053 96.632 750.061 96.632Z"/>
<path d="M893.792 35.72C891.008 29.864 886.976 25.352 881.696 22.184C876.416 18.92 870.272 17.288 863.264 17.288C856.256 17.288 849.92 18.92 844.256 22.184C838.688 25.352 834.272 29.96 831.008 36.008C827.84 41.96 826.256 48.872 826.256 56.744C826.256 64.616 827.84 71.528 831.008 77.48C834.272 83.432 838.688 88.04 844.256 91.304C849.92 94.472 856.256 96.056 863.264 96.056C873.056 96.056 881.12 93.128 887.456 87.272C893.792 81.416 897.488 73.496 898.544 63.512H858.512V52.856H912.512V62.936C911.744 71.192 909.152 78.776 904.736 85.688C900.32 92.504 894.512 97.928 887.312 101.96C880.112 105.896 872.096 107.864 863.264 107.864C853.952 107.864 845.456 105.704 837.776 101.384C830.096 96.968 824 90.872 819.488 83.096C815.072 75.32 812.864 66.536 812.864 56.744C812.864 46.952 815.072 38.168 819.488 30.392C824 22.52 830.096 16.424 837.776 12.104C845.456 7.68798 853.952 5.47998 863.264 5.47998C873.92 5.47998 883.328 8.11998 891.488 13.4C899.744 18.68 905.744 26.12 909.488 35.72H893.792Z"/>
</mask>
<path d="M84 107H70.896L18.192 27.08V107H5.08801V6.48798H18.192L70.896 86.264V6.48798H84V107Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M119.442 17.288V50.84H156.018V61.64H119.442V96.2H160.338V107H106.338V6.48798H160.338V17.288H119.442Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M211.414 6.63198C222.358 6.63198 231.814 8.69598 239.782 12.824C247.846 16.856 253.99 22.664 258.214 30.248C262.534 37.832 264.694 46.76 264.694 57.032C264.694 67.304 262.534 76.232 258.214 83.816C253.99 91.304 247.846 97.064 239.782 101.096C231.814 105.032 222.358 107 211.414 107H180.166V6.63198H211.414ZM211.414 96.2C224.374 96.2 234.262 92.792 241.078 85.976C247.894 79.064 251.302 69.416 251.302 57.032C251.302 44.552 247.846 34.808 240.934 27.8C234.118 20.792 224.278 17.288 211.414 17.288H193.27V96.2H211.414Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M295.083 6.63198V107H281.979V6.63198H295.083Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M376.744 84.68H332.968L324.904 107H311.08L347.368 7.20798H362.488L398.632 107H384.808L376.744 84.68ZM373 74.024L354.856 23.336L336.712 74.024H373Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M493.359 107H480.255L427.551 27.08V107H414.447V6.48798H427.551L480.255 86.264V6.48798H493.359V107Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M604.344 55.304C607.992 55.88 611.304 57.368 614.28 59.768C617.352 62.168 619.752 65.144 621.48 68.696C623.304 72.248 624.216 76.04 624.216 80.072C624.216 85.16 622.92 89.768 620.328 93.896C617.736 97.928 613.944 101.144 608.952 103.544C604.056 105.848 598.248 107 591.528 107H554.088V6.63198H590.088C596.904 6.63198 602.712 7.78398 607.512 10.088C612.312 12.296 615.912 15.32 618.312 19.16C620.712 23 621.912 27.32 621.912 32.12C621.912 38.072 620.28 43.016 617.016 46.952C613.848 50.792 609.624 53.576 604.344 55.304ZM567.192 49.976H589.224C595.368 49.976 600.12 48.536 603.48 45.656C606.84 42.776 608.52 38.792 608.52 33.704C608.52 28.616 606.84 24.632 603.48 21.752C600.12 18.872 595.272 17.432 588.936 17.432H567.192V49.976ZM590.376 96.2C596.904 96.2 601.992 94.664 605.64 91.592C609.288 88.52 611.112 84.248 611.112 78.776C611.112 73.208 609.192 68.84 605.352 65.672C601.512 62.408 596.376 60.776 589.944 60.776H567.192V96.2H590.376Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M655.505 96.344H690.641V107H642.401V6.63198H655.505V96.344Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M750.061 108.008C740.749 108.008 732.253 105.848 724.573 101.528C716.893 97.112 710.797 91.016 706.285 83.24C701.869 75.368 699.661 66.536 699.661 56.744C699.661 46.952 701.869 38.168 706.285 30.392C710.797 22.52 716.893 16.424 724.573 12.104C732.253 7.68798 740.749 5.47998 750.061 5.47998C759.469 5.47998 768.013 7.68798 775.693 12.104C783.373 16.424 789.421 22.472 793.837 30.248C798.253 38.024 800.461 46.856 800.461 56.744C800.461 66.632 798.253 75.464 793.837 83.24C789.421 91.016 783.373 97.112 775.693 101.528C768.013 105.848 759.469 108.008 750.061 108.008ZM750.061 96.632C757.069 96.632 763.357 95 768.925 91.736C774.589 88.472 779.005 83.816 782.173 77.768C785.437 71.72 787.069 64.712 787.069 56.744C787.069 48.68 785.437 41.672 782.173 35.72C779.005 29.672 774.637 25.016 769.069 21.752C763.501 18.488 757.165 16.856 750.061 16.856C742.957 16.856 736.621 18.488 731.053 21.752C725.485 25.016 721.069 29.672 717.805 35.72C714.637 41.672 713.053 48.68 713.053 56.744C713.053 64.712 714.637 71.72 717.805 77.768C721.069 83.816 725.485 88.472 731.053 91.736C736.717 95 743.053 96.632 750.061 96.632Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
<path d="M893.792 35.72C891.008 29.864 886.976 25.352 881.696 22.184C876.416 18.92 870.272 17.288 863.264 17.288C856.256 17.288 849.92 18.92 844.256 22.184C838.688 25.352 834.272 29.96 831.008 36.008C827.84 41.96 826.256 48.872 826.256 56.744C826.256 64.616 827.84 71.528 831.008 77.48C834.272 83.432 838.688 88.04 844.256 91.304C849.92 94.472 856.256 96.056 863.264 96.056C873.056 96.056 881.12 93.128 887.456 87.272C893.792 81.416 897.488 73.496 898.544 63.512H858.512V52.856H912.512V62.936C911.744 71.192 909.152 78.776 904.736 85.688C900.32 92.504 894.512 97.928 887.312 101.96C880.112 105.896 872.096 107.864 863.264 107.864C853.952 107.864 845.456 105.704 837.776 101.384C830.096 96.968 824 90.872 819.488 83.096C815.072 75.32 812.864 66.536 812.864 56.744C812.864 46.952 815.072 38.168 819.488 30.392C824 22.52 830.096 16.424 837.776 12.104C845.456 7.68798 853.952 5.47998 863.264 5.47998C873.92 5.47998 883.328 8.11998 891.488 13.4C899.744 18.68 905.744 26.12 909.488 35.72H893.792Z" stroke="white" stroke-width="10" mask="url(#path-1-outside-1)"/>
</svg>

现在为了样式的目的，我想以不同的方式访问每个路径，我的css是

#logo path: nth-child(1) 
{
stroke-dasharray: 220px;
stroke-dashoffset: 50px;
}   

但它不是这样工作的。然而，如果我使用，笔划dasharray和笔划dashoffset都可以工作

#logo path
{
stroke-dasharray: 220px;
stroke-dashoffset: 50px;
}

Answer 1

删除path:和nth-child(1)之间的空格，如下所示：

#logo path:nth-child(1)

编辑：改为使用nth-of-type(1)，如下所示：

#logo path:nth-of-type(1) 
{
stroke-dasharray: 220px;
stroke-dashoffset: 50px;
}