You need to override the CSS of Bootstrap and set outline:none.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.nav-tabs a, .nav-tabs a:hover, .nav-tabs a:focus
{
outline: 0;
}
</style>
</head>
<body>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<div class="panel panel-default" style="width: 500px; padding: 10px; margin: 10px">
<div id="Tabs" role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li class = "active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
<li><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
<li><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
<li><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content" style = "padding-top20px">
<div role="tabpanel" class="tab-pane active" id="home">
Home Tab
</div>
<div role="tabpanel" class="tab-pane" id="profile">
Profile Tab</div>
<div role="tabpanel" class="tab-pane" id="messages">
Messages Tab</div>
<div role="tabpanel" class="tab-pane" id="settings">
Settings Tab</div>
<br />
<br />
</div>
</div>
</div>
</body>
</html>
Demo
