Bootstrap Snippet Team Showcase using HTML CSS

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<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="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!-- Nav tabs -->
<ul class="nav nav-tabs nav-justified" role="tablist">
  <li class="nav-item">
    <a class="nav-link active" data-toggle="tab" href="#home" role="tab">Home</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-toggle="tab" href="#profile" role="tab">Profile</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-toggle="tab" href="#messages" role="tab">Messages</a>
  </li>
  <li class="nav-item">
    <a class="nav-link" data-toggle="tab" href="#settings" role="tab">Settings</a>
  </li>
</ul>
<!-- Tab panes -->
<div class="tab-content girintile "><br>
  <div class="tab-pane box active" id="home" role="tabpanel"><h4 class="bg-grey">Yunus Melih Gözütok</h4><p class="text-justified girintile"> yunus</p></div>
  <div class="tab-pane" id="profile" role="tabpanel">melih</div>
  <div class="tab-pane" id="messages" role="tabpanel">gözütok</div>
  <div class="tab-pane" id="settings" role="tabpanel">...</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
.girintile { padding-left: 10%; padding-right:10%; }
.box {border: 1px solid #e6e7e8;  border-radius: 10px -webkit-box-shadow: 10px 10px 5px -4px rgba(214,214,214,1);
-moz-box-shadow: 10px 10px 5px -4px rgba(214,214,214,1);
box-shadow: 10px 10px 5px -4px rgba(214,214,214,1);}
.reset{padding: 0; margin: 0;}
.team-box { border: 2px solid #e6e7e8; padding: 3%; }
.no-a a, a:hover{text-decoration: none;}
.nav {padding: 0 !important; margin: 0 !important;}
.sagdan{margin-right: 5px;}
.bg-grey{background-color: #f6f6f6; padding: 1%}
.liste li {padding: 1%;}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Team Showcase"
Bootstrap 4.0.0 Snippet by ymgymg

Related: See More

Questions / Comments:

"Team Showcase" Bootstrap 4.0.0 Snippet by ymgymg

Related: See More

Questions / Comments:

"Team Showcase"
Bootstrap 4.0.0 Snippet by ymgymg