인프런 커뮤니티 질문&답변

슬라이드 애니메이션 css 부분에서

가로와 세로로 만드는 부분은 

.sldie  div{ }에 설정값을 주셨고,

크로스 페이드에는 

.slide div a {}에 설정값을 주셨는데

왜 그런거죠?

가로

.slide {
    /*position: relative;*/
    width: 1200px;
    height: 300px;
    overflow: hidden;
}
.slide > div {
    width: 3600px;
    font-size: 0;
    /*position: absolute;*/
    /*top: 0;
    left: 0;*/
    animation: slide 10s linear infinite;

세로 

.slide {
    /*position: relative;*/
    width: 1200px;
    height: 300px;
    overflow: hidden;
}
.slide > div {
    /*position: absolute;
    top: 0;
    left: 0;*/
    font-size: 0;
    animation: slide 10s linear infinite;
}

크로스페이드

.slide {
    position: relative;
    width: 1200px;
    height: 300px;
}
.slide div {
    font-size: 0;
}
.slide div a {
    position: absolute;
    top: 0;
    left: 0;
    animation: slide 10s linear infinite;
    /*opacity: 0;*/
    visibility: hidden;
}