css border-image 在手机端的兼容性问题
在使用 CSS 的 border-image 属性时，您可能会遇到在移动设备上显示异常的问题。这是因为此属性在移动设备上尚未得到广泛支持。
问题表现
例如，以下代码在台式机上会正常显示边框图片：
#demo {
margin-left: 3rem;
width: 100px;
height: 100px;
border-left: 3px solid;
border-image: linear-gradient(red, blue) 1;
}但在移动设备上，整个盒子都会显示边框图片，而不是只显示左侧：
立即学习“前端免费学习笔记（深入）”；
为了解决此问题，可以将 border 属性设置为 0，然后只设置 border-left。这样，边框图片仅会应用在左侧：
#demo {
margin-left: 3rem;
width: 100px;
height: 100px;
border: 0;
border-left: 3px solid;
border-image: linear-gradient(red, blue) 1;
}通过这种方式，可以在移动设备上兼容 border-image 属性，确保其按照预期显示。
