如何制作技能共享中的线路？
How to make the line which is in skillshare?
如何制作这种线条？
Skillshare 使用一个非常高的 svg 文件来创建这条线。其他一切都叠加在线条之上以产生这种效果。您可以在 loh-content/loh-path/svg.
的检查器中找到它
在这里您可以看到线条在整个页面中的分布情况：
<!-- Important: This is directly from skillshare.com, so this is just an example to see how the line works, do not steal other creators work -->
<svg width="2560" height="5709" viewBox="0 0 2560 5709" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M535.771 5.99991L535.771 1.99991L535.771 5.99991ZM1390.77 1627L1390.77 1631L1390.77 1627ZM1056.04 2081.64L1053.52 2078.53L1056.04 2081.64ZM1288.27 2946.5L1287.71 2950.46L1288.27 2946.5ZM1222.27 4823.5L1222.72 4819.52L1222.27 4823.5ZM871.271 4580L867.358 4579.17L871.271 4580ZM1976.27 5703L1976.27 5707L1976.27 5703ZM1283.77 1400.5L1287.53 1399.15L1283.77 1400.5ZM1390.77 1623C1262.14 1623 1152.97 1610.24 1076.09 1575.91C1037.71 1558.77 1007.55 1536.34 986.985 1507.6C966.442 1478.9 955.271 1443.64 955.271 1400.5L947.271 1400.5C947.271 1445.11 958.85 1482.04 980.479 1512.26C1002.08 1542.44 1033.52 1565.66 1072.83 1583.21C1151.32 1618.26 1261.9 1631 1390.77 1631L1390.77 1623ZM535.771 9.99991C686.612 9.99985 898.913 46.0499 1104.33 134.742C1309.74 223.43 1507.94 364.614 1631.09 574.663L1637.99 570.616C1513.73 358.666 1313.94 216.529 1107.5 127.397C901.076 38.2698 687.694 1.99985 535.771 1.99991L535.771 9.99991ZM1631.09 574.663C1754.24 784.72 1783.19 1047.27 1736.53 1257.2C1689.8 1467.41 1567.89 1623 1390.77 1623L1390.77 1631C1573.65 1631 1697.33 1470.41 1744.34 1258.94C1791.4 1047.19 1762.24 782.558 1637.99 570.616L1631.09 574.663ZM1775.28 4158.71C1768.98 4245.32 1713.71 4299.62 1632.18 4336.23C1550.5 4372.91 1443.22 4391.44 1334.54 4406.6C1226.14 4421.72 1116.27 4433.51 1030.41 4456.85C944.858 4480.11 880.89 4515.41 867.358 4579.17L875.184 4580.83C887.652 4522.09 946.958 4487.83 1032.5 4464.57C1117.73 4441.4 1226.78 4429.71 1335.65 4414.52C1444.24 4399.37 1552.6 4380.74 1635.46 4343.53C1718.48 4306.25 1776.66 4249.93 1783.26 4159.29L1775.28 4158.71ZM867.358 4579.17C852.894 4647.32 891.635 4703.94 958.227 4745.95C1024.84 4787.97 1120.22 4816.07 1221.82 4827.47L1222.72 4819.52C1121.83 4808.2 1027.74 4780.34 962.496 4739.18C897.232 4698.01 861.723 4644.25 875.184 4580.83L867.358 4579.17ZM1221.82 4827.47C1345.78 4841.39 1430.52 4858.52 1483.29 4880.15C1509.67 4890.96 1527.71 4902.75 1538.7 4915.52C1549.56 4928.14 1553.66 4941.82 1551.98 4957C1550.29 4972.37 1542.64 4989.56 1529.37 5008.83C1516.13 5028.07 1497.49 5049.09 1474.2 5072.11C1427.62 5118.16 1362.9 5171.74 1286.73 5234.4L1291.81 5240.58C1367.89 5177.99 1432.93 5124.16 1479.83 5077.8C1503.28 5054.62 1522.32 5033.19 1535.96 5013.37C1549.58 4993.58 1558.04 4975.11 1559.93 4957.88C1561.86 4940.44 1557.04 4924.56 1544.76 4910.3C1532.61 4896.18 1513.27 4883.79 1486.33 4872.75C1432.46 4850.67 1346.76 4833.45 1222.72 4819.52L1221.82 4827.47ZM955.271 1400.5C955.271 1357.72 971.384 1325.19 996.388 1303.12C1021.46 1281 1055.74 1269.18 1092.31 1268.46C1165.45 1267.02 1246.92 1309.97 1280.01 1401.86L1287.53 1399.15C1253.19 1303.75 1168.41 1258.96 1092.15 1260.46C1054.03 1261.21 1017.83 1273.54 991.095 1297.13C964.292 1320.78 947.271 1355.53 947.271 1400.5L955.271 1400.5ZM1280.01 1401.86C1311.13 1488.28 1337.41 1590.25 1314.64 1704.06C1291.88 1817.8 1220 1943.99 1053.52 2078.53L1058.55 2084.75C1226.08 1949.36 1299.27 1821.65 1322.48 1705.63C1345.68 1589.68 1318.83 1486.05 1287.53 1399.15L1280.01 1401.86ZM1286.73 5234.4C1210.21 5297.35 1175.46 5358.84 1177.53 5416.05C1179.61 5473.33 1218.52 5524.7 1285.43 5567.55C1419.21 5653.24 1668.03 5707 1976.27 5707L1976.27 5699C1668.52 5699 1421.58 5645.26 1289.74 5560.82C1223.84 5518.61 1187.47 5469.26 1185.53 5415.76C1183.59 5362.21 1216.08 5302.88 1291.81 5240.58L1286.73 5234.4ZM1053.52 2078.53C905.305 2198.31 816.588 2308.6 774.368 2407.89C732.088 2507.33 736.475 2595.68 774.35 2671.02C812.148 2746.2 883.066 2807.97 973.063 2854.95C1063.09 2901.95 1172.49 2934.29 1287.71 2950.46L1288.83 2942.54C1174.31 2926.46 1065.82 2894.35 976.765 2847.86C887.674 2801.35 818.293 2740.61 781.498 2667.42C744.779 2594.39 740.278 2508.51 781.73 2411.02C823.243 2313.4 910.881 2204.09 1058.55 2084.75L1053.52 2078.53ZM1342.51 3448.44C1283.81 3472.78 1246.37 3496.79 1226.28 3521.16C1216.18 3533.42 1210.39 3545.86 1208.58 3558.52C1206.78 3571.18 1209.01 3583.77 1214.47 3596.24C1225.32 3621 1249.05 3645.69 1280.28 3670.75C1311.61 3695.89 1350.96 3721.78 1393.6 3748.81C1479.05 3802.99 1577.79 3861.84 1653.65 3929.29C1729.56 3996.77 1781.59 4072 1775.28 4158.71L1783.26 4159.29C1789.85 4068.75 1735.4 3991.26 1658.96 3923.31C1582.48 3855.31 1483 3796.01 1397.89 3742.05C1355.25 3715.02 1316.23 3689.34 1285.29 3664.52C1254.26 3639.61 1231.83 3615.94 1221.8 3593.03C1216.83 3581.66 1214.95 3570.58 1216.5 3559.65C1218.06 3548.7 1223.1 3537.6 1232.45 3526.25C1251.26 3503.43 1287.21 3480.03 1345.57 3455.83L1342.51 3448.44ZM1287.71 2950.46C1428.88 2970.28 1531.79 2999.58 1599.52 3035.23C1667.32 3070.92 1698.94 3112.42 1699.79 3156.36C1700.65 3200.59 1670.46 3249.23 1609.83 3299.31C1549.36 3349.26 1459.37 3399.99 1342.51 3448.44L1345.57 3455.83C1462.82 3407.22 1553.61 3356.13 1614.93 3305.48C1676.09 3254.95 1708.72 3204.2 1707.79 3156.2C1706.85 3107.93 1672.07 3064.38 1603.24 3028.15C1534.34 2991.88 1430.39 2962.41 1288.83 2942.54L1287.71 2950.46ZM535.771 1.99991C416.807 1.99996 142.392 23.7138 -2.38593 56.5995L-0.61408 64.4008C143.408 31.6865 417.194 9.99996 535.771 9.99991L535.771 1.99991ZM1976.27 5707C2123.6 5707 2263.21 5694.36 2369.23 5680.72C2475.12 5667.09 2547.81 5652.44 2561.18 5648.32L2558.82 5640.68C2546.19 5644.56 2474.13 5659.16 2368.21 5672.78C2262.43 5686.39 2123.17 5699 1976.27 5699L1976.27 5707Z" fill="#00FF84"></path>
</svg>
因此，要模糊地回答您的问题，您需要查看以下内容：
- 如何创建 svg 图片
- 用于对图像进行分层的基本 CSS (z-index)
如何制作这种线条？
Skillshare 使用一个非常高的 svg 文件来创建这条线。其他一切都叠加在线条之上以产生这种效果。您可以在 loh-content/loh-path/svg.
在这里您可以看到线条在整个页面中的分布情况：
<!-- Important: This is directly from skillshare.com, so this is just an example to see how the line works, do not steal other creators work -->
<svg width="2560" height="5709" viewBox="0 0 2560 5709" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M535.771 5.99991L535.771 1.99991L535.771 5.99991ZM1390.77 1627L1390.77 1631L1390.77 1627ZM1056.04 2081.64L1053.52 2078.53L1056.04 2081.64ZM1288.27 2946.5L1287.71 2950.46L1288.27 2946.5ZM1222.27 4823.5L1222.72 4819.52L1222.27 4823.5ZM871.271 4580L867.358 4579.17L871.271 4580ZM1976.27 5703L1976.27 5707L1976.27 5703ZM1283.77 1400.5L1287.53 1399.15L1283.77 1400.5ZM1390.77 1623C1262.14 1623 1152.97 1610.24 1076.09 1575.91C1037.71 1558.77 1007.55 1536.34 986.985 1507.6C966.442 1478.9 955.271 1443.64 955.271 1400.5L947.271 1400.5C947.271 1445.11 958.85 1482.04 980.479 1512.26C1002.08 1542.44 1033.52 1565.66 1072.83 1583.21C1151.32 1618.26 1261.9 1631 1390.77 1631L1390.77 1623ZM535.771 9.99991C686.612 9.99985 898.913 46.0499 1104.33 134.742C1309.74 223.43 1507.94 364.614 1631.09 574.663L1637.99 570.616C1513.73 358.666 1313.94 216.529 1107.5 127.397C901.076 38.2698 687.694 1.99985 535.771 1.99991L535.771 9.99991ZM1631.09 574.663C1754.24 784.72 1783.19 1047.27 1736.53 1257.2C1689.8 1467.41 1567.89 1623 1390.77 1623L1390.77 1631C1573.65 1631 1697.33 1470.41 1744.34 1258.94C1791.4 1047.19 1762.24 782.558 1637.99 570.616L1631.09 574.663ZM1775.28 4158.71C1768.98 4245.32 1713.71 4299.62 1632.18 4336.23C1550.5 4372.91 1443.22 4391.44 1334.54 4406.6C1226.14 4421.72 1116.27 4433.51 1030.41 4456.85C944.858 4480.11 880.89 4515.41 867.358 4579.17L875.184 4580.83C887.652 4522.09 946.958 4487.83 1032.5 4464.57C1117.73 4441.4 1226.78 4429.71 1335.65 4414.52C1444.24 4399.37 1552.6 4380.74 1635.46 4343.53C1718.48 4306.25 1776.66 4249.93 1783.26 4159.29L1775.28 4158.71ZM867.358 4579.17C852.894 4647.32 891.635 4703.94 958.227 4745.95C1024.84 4787.97 1120.22 4816.07 1221.82 4827.47L1222.72 4819.52C1121.83 4808.2 1027.74 4780.34 962.496 4739.18C897.232 4698.01 861.723 4644.25 875.184 4580.83L867.358 4579.17ZM1221.82 4827.47C1345.78 4841.39 1430.52 4858.52 1483.29 4880.15C1509.67 4890.96 1527.71 4902.75 1538.7 4915.52C1549.56 4928.14 1553.66 4941.82 1551.98 4957C1550.29 4972.37 1542.64 4989.56 1529.37 5008.83C1516.13 5028.07 1497.49 5049.09 1474.2 5072.11C1427.62 5118.16 1362.9 5171.74 1286.73 5234.4L1291.81 5240.58C1367.89 5177.99 1432.93 5124.16 1479.83 5077.8C1503.28 5054.62 1522.32 5033.19 1535.96 5013.37C1549.58 4993.58 1558.04 4975.11 1559.93 4957.88C1561.86 4940.44 1557.04 4924.56 1544.76 4910.3C1532.61 4896.18 1513.27 4883.79 1486.33 4872.75C1432.46 4850.67 1346.76 4833.45 1222.72 4819.52L1221.82 4827.47ZM955.271 1400.5C955.271 1357.72 971.384 1325.19 996.388 1303.12C1021.46 1281 1055.74 1269.18 1092.31 1268.46C1165.45 1267.02 1246.92 1309.97 1280.01 1401.86L1287.53 1399.15C1253.19 1303.75 1168.41 1258.96 1092.15 1260.46C1054.03 1261.21 1017.83 1273.54 991.095 1297.13C964.292 1320.78 947.271 1355.53 947.271 1400.5L955.271 1400.5ZM1280.01 1401.86C1311.13 1488.28 1337.41 1590.25 1314.64 1704.06C1291.88 1817.8 1220 1943.99 1053.52 2078.53L1058.55 2084.75C1226.08 1949.36 1299.27 1821.65 1322.48 1705.63C1345.68 1589.68 1318.83 1486.05 1287.53 1399.15L1280.01 1401.86ZM1286.73 5234.4C1210.21 5297.35 1175.46 5358.84 1177.53 5416.05C1179.61 5473.33 1218.52 5524.7 1285.43 5567.55C1419.21 5653.24 1668.03 5707 1976.27 5707L1976.27 5699C1668.52 5699 1421.58 5645.26 1289.74 5560.82C1223.84 5518.61 1187.47 5469.26 1185.53 5415.76C1183.59 5362.21 1216.08 5302.88 1291.81 5240.58L1286.73 5234.4ZM1053.52 2078.53C905.305 2198.31 816.588 2308.6 774.368 2407.89C732.088 2507.33 736.475 2595.68 774.35 2671.02C812.148 2746.2 883.066 2807.97 973.063 2854.95C1063.09 2901.95 1172.49 2934.29 1287.71 2950.46L1288.83 2942.54C1174.31 2926.46 1065.82 2894.35 976.765 2847.86C887.674 2801.35 818.293 2740.61 781.498 2667.42C744.779 2594.39 740.278 2508.51 781.73 2411.02C823.243 2313.4 910.881 2204.09 1058.55 2084.75L1053.52 2078.53ZM1342.51 3448.44C1283.81 3472.78 1246.37 3496.79 1226.28 3521.16C1216.18 3533.42 1210.39 3545.86 1208.58 3558.52C1206.78 3571.18 1209.01 3583.77 1214.47 3596.24C1225.32 3621 1249.05 3645.69 1280.28 3670.75C1311.61 3695.89 1350.96 3721.78 1393.6 3748.81C1479.05 3802.99 1577.79 3861.84 1653.65 3929.29C1729.56 3996.77 1781.59 4072 1775.28 4158.71L1783.26 4159.29C1789.85 4068.75 1735.4 3991.26 1658.96 3923.31C1582.48 3855.31 1483 3796.01 1397.89 3742.05C1355.25 3715.02 1316.23 3689.34 1285.29 3664.52C1254.26 3639.61 1231.83 3615.94 1221.8 3593.03C1216.83 3581.66 1214.95 3570.58 1216.5 3559.65C1218.06 3548.7 1223.1 3537.6 1232.45 3526.25C1251.26 3503.43 1287.21 3480.03 1345.57 3455.83L1342.51 3448.44ZM1287.71 2950.46C1428.88 2970.28 1531.79 2999.58 1599.52 3035.23C1667.32 3070.92 1698.94 3112.42 1699.79 3156.36C1700.65 3200.59 1670.46 3249.23 1609.83 3299.31C1549.36 3349.26 1459.37 3399.99 1342.51 3448.44L1345.57 3455.83C1462.82 3407.22 1553.61 3356.13 1614.93 3305.48C1676.09 3254.95 1708.72 3204.2 1707.79 3156.2C1706.85 3107.93 1672.07 3064.38 1603.24 3028.15C1534.34 2991.88 1430.39 2962.41 1288.83 2942.54L1287.71 2950.46ZM535.771 1.99991C416.807 1.99996 142.392 23.7138 -2.38593 56.5995L-0.61408 64.4008C143.408 31.6865 417.194 9.99996 535.771 9.99991L535.771 1.99991ZM1976.27 5707C2123.6 5707 2263.21 5694.36 2369.23 5680.72C2475.12 5667.09 2547.81 5652.44 2561.18 5648.32L2558.82 5640.68C2546.19 5644.56 2474.13 5659.16 2368.21 5672.78C2262.43 5686.39 2123.17 5699 1976.27 5699L1976.27 5707Z" fill="#00FF84"></path>
</svg>
因此，要模糊地回答您的问题，您需要查看以下内容：
- 如何创建 svg 图片
- 用于对图像进行分层的基本 CSS (z-index)