iOS设备上的CSS3过渡问题 [英] CSS3 transition problem on iOS devices

查看：186
本文介绍了iOS设备上的CSS3过渡问题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我在网站上尝试了一些webkit转换，并在iOS设备上遇到了问题。我有六个图像每秒随机旋转。这种转换在六个图像中的五个处理效果很好，但由于某些原因，在使用iPad或iPhone时，第六个图像在转换期间消失。



您可以查看示例这里。



CSS： 

  .b1_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 -webkit-transform：rotate（0deg）; 
 transform：rotate（0deg）; 
 -webkit-transition：-webkit-transform 0.5s ease-out; 
 transition：transform 0.15s linear; 
} 
 
 .b2_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 -webkit-transform：rotate（0deg）; 
 transform：rotate（0deg）; 
 -webkit-transition：-webkit-transform 0.5s easy-out; 
 transition：transform 0.15s linear; 
} 
 
 .m1_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 -webkit-transform：rotate（0deg）; 
 transform：rotate（0deg）; 
 -webkit-transition：-webkit-transform 0.5s ease-out; 
 transition：transform 0.15s linear; 
} 
 
 .m2_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 -webkit-transform：rotate（0deg）; 
 transform：rotate（0deg）; 
 -webkit-transition：-webkit-transform 0.5s ease-out; 
 transition：transform 0.15s linear; 
} 
 
 .s1_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 -webkit-transform：rotate（0deg）; 
 position：relative; 
 top：6px; 
 transform：rotate（0deg）; 
 -webkit-transition：-webkit-transform 0.5s ease-out; 
 transition：transform 0.15s linear; 
} 
 
 .s2_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 -webkit-transform：rotate（0deg）; 
 position：relative; 
 top：7px; 
 transform：rotate（0deg）; 
 -webkit-transition：-webkit-transform 0.5s ease-out; 
 transition：transform 0.15s linear; 
}

Javascript：



<$ $ p> var ranNum;

function randomFromTo（from，to）{
ranNum = Math.floor（Math.random（）*（to - from + 1）+ from）;
ranNum = ranNum +deg;
return ranNum;
}

setInterval（function newNum（）{
document.getElementById（needle_b1）。style.webkitTransform =rotate（+ randomFromTo（0,293）+） ;
document.getElementById（needle_b2）。style.webkitTransform =rotate（+ randomFromTo（0,285）+）;
document.getElementById（needle_m1）。style.webkitTransform = rotate（+ randomFromTo（0,314）+）;
document.getElementById（needle_m2）。style.webkitTransform =rotate（+ randomFromTo（0,223）+）;
document。 getElementById（needle_s1）。style.webkitTransform =rotate（+ randomFromTo（0,130）+）;
document.getElementById（needle_s2）。style.webkitTransform =rotate（+ randomFromTo ，95）+）;
}，2000）;

我最初认为这是一个内存问题，但删除了从所有的转换，做出改变。

解决方案

您的z-index值从-2开始。在我的经验Webkit不介意你使用负值，但似乎Mobile Webkit。



如果你在.b1_needle上放一个边框，你会注意到它出现在下面.bigOne，尽管z-index为100.



从0开始你的z-index，然后上去。



复制并粘贴此CSS以验证：

  @media屏幕和（orientation：portrait）
 { 
 .container {
 background：url（../ images / back_port.jpg）; 
 background-position：top left; 
 background-repeat：no-repeat; 
 width：768px; 
 height：1004px; 
 position：absolute; 
 top：0px; 
 left：0px; 
 z-index：0; 
} 
 
 .bigOne {
 position：absolute; 
 right：29px; 
 top：21px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：350px; 
 -webkit-border-radius：190px; 
 width：350px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
 
 .bigTwo {
 position：absolute; 
 right：29px; 
 bottom：21px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：350px; 
 -webkit-border-radius：190px; 
 width：350px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
 
 .midOne {
 position：absolute; 
 right：502px; 
 top：243px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：218px; 
 -webkit-border-radius：124px; 
 width：218px; 
 z-index：1; 
 -webkit-box-shadow：inset 0 3px 4px＃000; 
} 
 
 .midTwo {
 position：absolute; 
 right：502px; 
 bottom：243px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：218px; 
 -webkit-border-radius：124px; 
 width：218px; 
 z-index：1; 
 -webkit-box-shadow：inset 0 3px 4px＃000; 
} 
 
 .smallOne {
 position：absolute; 
 top：50px; 
 right：437px; 
 background-color：＃000; 
 border：10px solid＃999; 
 height：128px; 
 -webkit-border-radius：74px; 
 width：128px; 
 z-index：1; 
} 
 
 .smallTwo {
 position：absolute; 
 bottom：50px; 
 right：437px; 
 background-color：＃000; 
 border：10px solid＃999; 
 height：128px; 
 -webkit-border-radius：74px; 
 width：128px; 
 z-index：1; 
} 
 
 .statusBox {
 position：absolute; 
 left：273px; 
 top：373px; 
 background-color：＃000; 
 border：10px solid＃999; 
 border-radius：8px; 
 width：150px; 
 height：237px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
 
 .iconBox {
 position：absolute; 
 left：465px; 
 top：463px; 
 width：264px; 
 height：58px; 
 background-color：＃000; 
 border：10px solid＃999; 
 border-radius：8px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
} 
 
 @media屏幕和（方向：横向）
 {
 .container {
 background：url images / back_land.jpg）; 
 background-position：top left; 
 background-repeat：no-repeat; 
 width：1024px; 
 height：748px; 
 position：absolute; 
 top：0px; 
 left：0px; 
 z-index：0; 
} 
 
 .bigOne {
 position：absolute; 
 left：21px; 
 top：29px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：350px; 
 -webkit-border-radius：190px; 
 width：350px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
 
 .bigTwo {
 position：absolute; 
 right：21px; 
 top：29px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：350px; 
 -webkit-border-radius：190px; 
 width：350px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
 
 .midOne {
 position：absolute; 
 left：243px; 
 top：482px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：218px; 
 -webkit-border-radius：124px; 
 width：218px; 
 z-index：1; 
 -webkit-box-shadow：inset 0 3px 4px＃000; 
} 
 
 .midTwo {
 position：absolute; 
 right：243px; 
 top：482px; 
 background-color：＃000; 
 border：15px solid＃999; 
 height：218px; 
 -webkit-border-radius：124px; 
 width：218px; 
 z-index：1; 
 -webkit-box-shadow：inset 0 3px 4px＃000; 
} 
 
 .smallOne {
 position：absolute; 
 left：50px; 
 top：437px; 
 background-color：＃000; 
 border：10px solid＃999; 
 height：128px; 
 -webkit-border-radius：74px; 
 width：128px; 
 z-index：1; 
} 
 
 .smallTwo {
 position：absolute; 
 right：50px; 
 top：437px; 
 background-color：＃000; 
 border：10px solid＃999; 
 height：128px; 
 -webkit-border-radius：74px; 
 width：128px; 
 z-index：1; 
} 
 
 .statusBox {
 position：absolute; 
 left：428px; 
 top：99px; 
 background-color：＃000; 
 border：10px solid＃999; 
 -webkit-border-radius：8px; 
 width：150px; 
 height：237px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
 
 .iconBox {
 position：absolute; 
 left：370px; 
 top：380px; 
 width：264px; 
 height：58px; 
 background-color：＃000; 
 border：10px solid＃999; 
 border-radius：8px; 
 z-index：1; 
 -webkit-box-shadow：0 3px 4px＃000; 
} 
} 
 
 .statusData {
 width：126px; 
 height：100％; 
 margin-left：auto; 
 margin-right：auto; 
} 
 
 .statusLogo {
 background：url（../ images / mccaLogo.png）; 
 height：87px; 
 width：100％; 
} 
 
 .digitalTxt {
 font-family：'Digital7Mono'; 
 font-size：32px; 
 color：#fff; 
 width：auto; 
 margin-left：auto; 
 margin-right：auto; 
 margin-top：3px; 
} 
 
 .statusDate {
 height：48px; 
 width：100％; 
 border-top：2px＃999 solid; 
} 
 
 .statusTime {
 height：48px; 
 width：100％; 
 border-top：2px＃999 solid; 
} 
 
 .statusLoc {
 height：48px; 
 width：100％; 
 border-top：2px＃999 solid; 
} 
 
 .b1_notch {
 width：100％; 
 height：100％; 
 background：url（../ images / b1_back.png）; 
 background-position：center; 
 background-repeat：no-repeat; 
 z-index：1; 
} 
 
 .b1_needle {
 width：100％; 
 height：100％; 
 z-index：2; 
 -webkit-transform：rotate3d（0，0，0，0deg）; 
 transform：rotate3d（0，0，0，0deg）; 
 -webkit-transition：all 0.5s linear; 
 transition：all 0.5s linear; 
} 
 
 .b2_notch {
 width：100％; 
 height：100％; 
 background：url（../ images / b2_back.png）; 
 background-position：center; 
 background-repeat：no-repeat; 
 z-index：1; 
} 
 
 .b2_needle {
 width：100％; 
 height：100％; 
 z-index：2; 
 -webkit-transform：rotate3d（0，0，0，0deg）; 
 transform：rotate3d（0，0，0，0deg）; 
 -webkit-transition：-webkit-transform 0.5s linear; 
 transition：transform 0.5s linear; 
} 
 
 .m1_notch {
 width：100％; 
 height：100％; 
 background：url（../ images / m1_back.png）; 
 background-position：center; 
 background-repeat：no-repeat; 
 z-index：1; 
} 
 
 .m1_needle {
 width：100％; 
 height：100％; 
 z-index：2; 
 -webkit-transform：rotate3d（0，0，0，0deg）; 
 transform：rotate3d（0，0，0，0deg）; 
 -webkit-transition：-webkit-transform 0.5s linear; 
 transition：transform 0.5s linear; 
} 
 
 .m2_notch {
 width：100％; 
 height：100％; 
 background：url（../ images / m2_back.png）; 
 background-position：center; 
 background-repeat：no-repeat; 
 z-index：1; 
} 
 
 .m2_needle {
 width：100％; 
 height：100％; 
 z-index：2; 
 -webkit-transform：rotate3d（0，0，0，0deg）; 
 transform：rotate3d（0，0，0，0deg）; 
 -webkit-transition：-webkit-transform 0.5s linear; 
 transition：transform 0.5s linear; 
} 
 
 .s1_notch {
 width：100％; 
 height：100％; 
 background：url（../ images / s1_back.png）; 
 background-position：center; 
 background-repeat：no-repeat; 
 z-index：1; 
} 
 
 .s1_needle {
 width：100％; 
 height：100％; 
 z-index：1; 
 position：relative; 
 top：6px; 
 -webkit-transform：rotate3d（0，0，0，0deg）; 
 transform：rotate3d（0，0，0，0deg）; 
 -webkit-transition：-webkit-transform 0.5s linear; 
 transition：transform 0.5s linear; 
} 
 
 .s2_notch {
 width：100％; 
 height：100％; 
 background：url（../ images / s2_back.png）; 
 background-position：center; 
 background-repeat：no-repeat; 
 z-index：1; 
} 
 
 .s2_needle {
 width：100％; 
 height：100％; 
 z-index：2; 
 position：relative; 
 top：7px; 
 -webkit-transform：rotate3d（0，0，0，0deg）; 
 transform：rotate3d（0，0，0，0deg）; 
 -webkit-transition：-webkit-transform 0.5s linear; 
 transition：transform 0.5s linear; 
}


I'm trying out some webkit transitions on a site and have come across a problem on iOS devices. I have six images being given a random rotation every second. The transition works fine for five out of the six images but for some reason when using the iPad or the iPhone the sixth image disappears during the transition.

You can view the example HERE.

CSS:

.b1_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform 0.5s ease-out;
    transition: transform 0.15s linear;
}

.b2_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform 0.5s ease-out;
    transition: transform 0.15s linear;
}

.m1_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform 0.5s ease-out;
    transition: transform 0.15s linear;
}

.m2_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform 0.5s ease-out;
    transition: transform 0.15s linear;
}

.s1_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    position: relative;
    top: 6px;
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform 0.5s ease-out;
    transition: transform 0.15s linear;
}

.s2_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    position: relative;
    top: 7px;
    transform: rotate(0deg);
    -webkit-transition: -webkit-transform 0.5s ease-out;
    transition: transform 0.15s linear;
}

Javascript:

var ranNum;

function randomFromTo(from, to){
    ranNum = Math.floor(Math.random() * (to - from + 1) + from);
    ranNum = ranNum + "deg";
    return ranNum;
}

setInterval(function newNum(){
    document.getElementById("needle_b1").style.webkitTransform = "rotate("+randomFromTo(0,293)+")";
    document.getElementById("needle_b2").style.webkitTransform = "rotate("+randomFromTo(0,285)+")";
    document.getElementById("needle_m1").style.webkitTransform = "rotate("+randomFromTo(0,314)+")";
    document.getElementById("needle_m2").style.webkitTransform = "rotate("+randomFromTo(0,223)+")";
    document.getElementById("needle_s1").style.webkitTransform = "rotate("+randomFromTo(0,130)+")";
    document.getElementById("needle_s2").style.webkitTransform = "rotate("+randomFromTo(0,95)+")";
}, 2000);

I originally thought it was a memory issue but removing the transition from all but that one image doesn't make a difference. Any ideas for why this is would be happening?

解决方案

Your z-index values are starting from -2. In my experience Webkit doesn't mind that you use negative values, but it seems Mobile Webkit does.

If you put a border on .b1_needle you will notice it appears below .bigOne, despite having a z-index of 100.

Start your z-indexes from 0 and then go up.

Copy and paste this CSS to verify:

@media screen and (orientation:portrait)
{
.container {
    background: url(../images/back_port.jpg);
    background-position: top left;
    background-repeat: no-repeat;
    width: 768px;
    height: 1004px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 0;
}

.bigOne {
    position: absolute;
    right: 29px;
    top: 21px;
    background-color: #000;
    border: 15px solid #999;
    height: 350px;
    -webkit-border-radius: 190px;
    width: 350px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}

.bigTwo {
    position: absolute;
    right: 29px;
    bottom: 21px;
    background-color: #000;
    border: 15px solid #999;
    height: 350px;
    -webkit-border-radius: 190px;
    width: 350px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}

.midOne {
    position: absolute;
    right: 502px;
    top: 243px;
    background-color: #000;
    border: 15px solid #999;
    height: 218px;
    -webkit-border-radius: 124px;
    width: 218px;
    z-index: 1;
    -webkit-box-shadow: inset 0 3px 4px #000;
}

.midTwo {
    position: absolute;
    right: 502px;
    bottom: 243px;
    background-color: #000;
    border: 15px solid #999;
    height: 218px;
    -webkit-border-radius: 124px;
    width: 218px;
    z-index: 1;
    -webkit-box-shadow: inset 0 3px 4px #000;
}

.smallOne {
    position: absolute;
    top: 50px;
    right: 437px;
    background-color: #000;
    border: 10px solid #999;
    height: 128px;
    -webkit-border-radius: 74px;
    width: 128px;
    z-index: 1;
}

.smallTwo {
    position: absolute;
    bottom: 50px;
    right: 437px;
    background-color: #000;
    border: 10px solid #999;
    height: 128px;
    -webkit-border-radius: 74px;
    width: 128px;
    z-index: 1;
}

.statusBox {
    position: absolute;
    left: 273px;
    top: 373px;
    background-color: #000;
    border: 10px solid #999;
    border-radius: 8px;
    width: 150px;
    height: 237px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}

.iconBox {
    position: absolute;
    left: 465px;
    top: 463px;
    width: 264px;
    height: 58px;
    background-color: #000;
    border: 10px solid #999;
    border-radius: 8px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}
}

@media screen and (orientation:landscape)
{
.container {
    background: url(../images/back_land.jpg);
    background-position: top left;
    background-repeat: no-repeat;
    width: 1024px;
    height: 748px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 0;
}

.bigOne {
    position: absolute;
    left: 21px;
    top: 29px;
    background-color: #000;
    border: 15px solid #999;
    height: 350px;
    -webkit-border-radius: 190px;
    width: 350px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}

.bigTwo {
    position: absolute;
    right: 21px;
    top: 29px;
    background-color: #000;
    border: 15px solid #999;
    height: 350px;
    -webkit-border-radius: 190px;
    width: 350px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}

.midOne {
    position: absolute;
    left: 243px;
    top: 482px;
    background-color: #000;
    border: 15px solid #999;
    height: 218px;
    -webkit-border-radius: 124px;
    width: 218px;
    z-index: 1;
    -webkit-box-shadow: inset 0 3px 4px #000;
}

.midTwo {
    position: absolute;
    right: 243px;
    top: 482px;
    background-color: #000;
    border: 15px solid #999;
    height: 218px;
    -webkit-border-radius: 124px;
    width: 218px;
    z-index: 1;
    -webkit-box-shadow: inset 0 3px 4px #000;
}

.smallOne {
    position: absolute;
    left: 50px;
    top: 437px;
    background-color: #000;
    border: 10px solid #999;
    height: 128px;
    -webkit-border-radius: 74px;
    width: 128px;
    z-index: 1;
}

.smallTwo {
    position: absolute;
    right: 50px;
    top: 437px;
    background-color: #000;
    border: 10px solid #999;
    height: 128px;
    -webkit-border-radius: 74px;
    width: 128px;
    z-index: 1;
}

.statusBox {
    position: absolute;
    left: 428px;
    top: 99px;
    background-color: #000;
    border: 10px solid #999;
    -webkit-border-radius: 8px;
    width: 150px;
    height: 237px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}

.iconBox {
    position: absolute;
    left: 370px;
    top: 380px;
    width: 264px;
    height: 58px;
    background-color: #000;
    border: 10px solid #999;
    border-radius: 8px;
    z-index: 1;
    -webkit-box-shadow: 0 3px 4px #000;
}
}

.statusData{
    width: 126px;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
}

.statusLogo{
    background: url(../images/mccaLogo.png);
    height: 87px;
    width: 100%;
}

.digitalTxt{
    font-family: 'Digital7Mono';
    font-size: 32px;
    color: #fff;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3px;
}

.statusDate{
    height: 48px;
    width: 100%;
    border-top: 2px #999 solid;
}

.statusTime{
    height: 48px;
    width: 100%;
    border-top: 2px #999 solid;
}

.statusLoc{
    height: 48px;
    width: 100%;
    border-top: 2px #999 solid;
}

.b1_notch {
    width: 100%;
    height: 100%;
    background: url(../images/b1_back.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.b1_needle {
    width: 100%;
    height: 100%;
    z-index: 2;
    -webkit-transform: rotate3d(0, 0, 0, 0deg);
    transform: rotate3d(0, 0, 0, 0deg);
    -webkit-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.b2_notch {
    width: 100%;
    height: 100%;
    background: url(../images/b2_back.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.b2_needle {
    width: 100%;
    height: 100%;
    z-index: 2;
    -webkit-transform: rotate3d(0, 0, 0, 0deg);
    transform: rotate3d(0, 0, 0, 0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
}

.m1_notch {
    width: 100%;
    height: 100%;
    background: url(../images/m1_back.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.m1_needle {
    width: 100%;
    height: 100%;
    z-index: 2;
    -webkit-transform: rotate3d(0, 0, 0, 0deg);
    transform: rotate3d(0, 0, 0, 0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
}

.m2_notch {
    width: 100%;
    height: 100%;
    background: url(../images/m2_back.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.m2_needle {
    width: 100%;
    height: 100%;
    z-index: 2;
    -webkit-transform: rotate3d(0, 0, 0, 0deg);
    transform: rotate3d(0, 0, 0, 0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
}

.s1_notch {
    width: 100%;
    height: 100%;
    background: url(../images/s1_back.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.s1_needle {
    width: 100%;
    height: 100%;
    z-index: 1;
    position: relative;
    top: 6px;
    -webkit-transform: rotate3d(0, 0, 0, 0deg);
    transform: rotate3d(0, 0, 0, 0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
}

.s2_notch {
    width: 100%;
    height: 100%;
    background: url(../images/s2_back.png);
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.s2_needle {
    width: 100%;
    height: 100%;
    z-index: 2;
    position: relative;
    top: 7px;
    -webkit-transform: rotate3d(0, 0, 0, 0deg);
    transform: rotate3d(0, 0, 0, 0deg);
    -webkit-transition: -webkit-transform 0.5s linear;
    transition: transform 0.5s linear;
}

这篇关于iOS设备上的CSS3过渡问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆