Karuseldeki önyükleme sütunu nasıl ortalanır?

Şu anda sadece bir atlıkarınca olan bootstrap sayfam var. Bir bootstrap atlıkarınca olan, ancak kırılmamış ve duyarlı olan ızgaramı ortalamak istiyorum. Mümkün mü ?Karuseldeki önyükleme sütunu nasıl ortalanır?

demo link

benim html yapısı:

<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>Bootstrap 101 Template</title> 

    <!-- Bootstrap --> 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> 
    <!--[if lt IE 9]> 
     <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> 
     <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> 
    <![endif]--> 
    </head> 
    <body> 
    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel"> 
    <!-- Indicators --> 
    <ol class="carousel-indicators"> 
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> 
    <li data-target="#carousel-example-generic" data-slide-to="1"></li> 
    <li data-target="#carousel-example-generic" data-slide-to="2"></li> 
    </ol> 

    <!-- Wrapper for slides --> 
    <div class="carousel-inner" role="listbox"> 

    <div class="myDiv "> 
      <div class="container"> 
      <div class="row"> 
       <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">left column..</div> 
       <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">right column..</div> 
      </div> 
      </div> 
    </div> 
    <div class="item active"> 
     <img src="http://www.aurumhotels.com.tr/resimler/normal/2015-08/FirmaArkaBanner1_4BuFjQUcCp3yALBpDUxLsignature.jpg" alt="..."> 
    </div> 
    <div class="item"> 
     <img src="http://www.aurumhotels.com.tr/resimler/normal/2015-12/FirmaArkaBanner1_Isrgao2xv47jrJVBsf2Hfirmaarkabanner2.png" alt="..."> 
    </div> 
    </div> 

    <!-- Controls --> 
    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> 
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span> 
    <span class="sr-only">Previous</span> 
    </a> 
    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> 
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span> 
    <span class="sr-only">Next</span> 
    </a> 
</div> 

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <!-- Include all compiled plugins (below), or include individual files as needed --> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
    </body> 
</html>

ve benim css yapısı

.myDiv{ 
     position: absolute; 
     background:#fff; 
     z-index:1; 
}

kaynak

2016-04-12 ani_css

Sen .myDiv css sınıfını gerekmez. Önyükleme önceden zaten çok sayıda css sınıfıyla birlikte gelir ve kapsayıcı ve sıvı içeren sayfa düzeninize yardımcı olur.

<div class="myDiv "> 
     <div class="container"> 
     <div class="row"> 
      <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">left column..</div> 
      <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">right column..</div> 
     </div> 
     </div> 
</div>

Sadece böyle bir şey yapmak: Bunun yerine aşağıdaki kod sonra

<div class="container-fluid"> 
     <div class="row"> 
      <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">left column..</div> 
      <div class="col-md-6 col-lg-6 col-sm-12 col-xs-12">right column..</div> 
     </div> 
</div>

Ve sadece metni ortalamak için konteyner-sıvı sütunları geçersiz kılmak için stil ekleyin.

kaynak

2016-04-12 19:30:56 yoonjesung

ekleyebilirsiniz .. :)) –

size merkezli ızgara ve kırılmamış/tepkili ile ne demek hakkında daha fazla ayrıntı verebilir misiniz? İki sütununuzun karusel ekranının ortasında olmasını istediğinizi mi sandınız? – yoonjesung

evet tam olarak :)) –

Eğer nopee..I işe yaramadı met çalıştı

.myDiv{ 
     position: absolute; 
     background:#fff; 
     z-index:1; 
     left:50%; 
}

kaynak

2016-04-13 17:38:43

no'lu pencerenin ortasında olması gerektiği anlamına geliyordu. –

Karuseldeki önyükleme sütunu nasıl ortalanır?

cevap

İlgili konular