2012-05-08 49 views

回答

1

你只是缺少它定義了很多東西像

.carousel { 
    position: relative; 
    margin-bottom: 18px; 
    line-height: 1; 
} 

.carousel-inner { 
    position: relative; 
    width: 100%; 
    overflow: hidden; 
} 

.carousel .item { 
    position: relative; 
    display: none; 
    -webkit-transition: 0.6s ease-in-out left; 
    -moz-transition: 0.6s ease-in-out left; 
     -ms-transition: 0.6s ease-in-out left; 
     -o-transition: 0.6s ease-in-out left; 
      transition: 0.6s ease-in-out left; 
} 

.carousel .item > img { 
    display: block; 
    line-height: 1; 
} 

.carousel .active, 
.carousel .next, 
.carousel .prev { 
    display: block; 
} 

.carousel .active { 
    left: 0; 
} 

.carousel .next, 
.carousel .prev { 
    position: absolute; 
    top: 0; 
    width: 100%; 
} 

.carousel .next { 
    left: 100%; 
} 

.carousel .prev { 
    left: -100%; 
} 

.carousel .next.left, 
.carousel .prev.right { 
    left: 0; 
} 

.carousel .active.left { 
    left: -100%; 
} 

.carousel .active.right { 
    left: 100%; 
} 

.carousel-control { 
    position: absolute; 
    top: 40%; 
    left: 15px; 
    width: 40px; 
    height: 40px; 
    margin-top: -20px; 
    font-size: 60px; 
    font-weight: 100; 
    line-height: 30px; 
    color: #ffffff; 
    text-align: center; 
    background: #222222; 
    border: 3px solid #ffffff; 
    -webkit-border-radius: 23px; 
    -moz-border-radius: 23px; 
      border-radius: 23px; 
    opacity: 0.5; 
    filter: alpha(opacity=50); 
} 

.carousel-control.right { 
    right: 15px; 
    left: auto; 
} 

.carousel-control:hover { 
    color: #ffffff; 
    text-decoration: none; 
    opacity: 0.9; 
    filter: alpha(opacity=90); 
} 

.carousel-caption { 
    position: absolute; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    padding: 10px 15px 5px; 
    background: #333333; 
    background: rgba(0, 0, 0, 0.75); 
} 

.carousel-caption h4, 
.carousel-caption p { 
    color: #ffffff; 
} 

工作演示的bootstrap.csshttp://jsfiddle.net/naveen/nPyKZ/

相關問題