<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <div class="card border-warning "> <div class="card-header" style="font-weight: bold;font-size: 20px">Languages</div> <div class="card-body"> <blockquote class="blockquote"></blockquote> <div class="accordion" id="accorID"> <div class="card "> <div class="card-header" id="headerOne"> <h5 class="mb-0"> <button id="aciklamaTooltip" title="Ayrıntıları görmek için tıklayınız." type="button" class="btn btn-light" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">JAVA</button> </h5> </div> <div class="collapse show" id="collapseOne" aria-labelledby="headerOne" data-parent="#accorID"> <div class="card-body">Grails, Hibernate, JHipster, MyBatis, PrimeFaces</div> </div> </div> <div class="card "> <div class="card-header" id="headerTwo"> <h5 class="mb-0"> <button id="aciklamaTooltip" title="Ayrıntıları görmek için tıklayınız." type="button" class="btn btn-light" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">PHP</button> </h5> </div> <div class="collapse" id="collapseTwo" aria-labelledby="headerTwo" data-parent="#accorID"> </h5> <div class="card-body">PhalconPHP, Laravel, Symfony, Yii 2, CakePHP</div> </div> </div> <div class="card "> <div class="card-header" id="headerThree"> <h5 class="mb-0"> <button type="button" id="aciklamaTooltip" title="Ayrıntıları görmek için tıklayınız." class="btn btn-light" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">JavaScirpt</button> </h5> </div> <div class="collapse" id="collapseThree" aria-labelledby="headerThree" data-parent="#accorID"> <div class="card-body">React.js, Angular.js, Vue.js, Meteor.js</div> </div> </div> </div> </blockquote> </div> <button class="btn btn-warning dropdown-toggle" style="font-weight: bold" type="button" data-toggle="collapse2" data-target="#collapseYetenekID">Read more..</button> </div> </div>