您是否看到此代码中有关我的引导标签的问题在哪里? 我在同一页面上尝试了bootstrap网站上的示例代码,它正在运行.. :(
引导程序标签:
<div>
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
<li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
<li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
<li role="presentation"><a href="#settings" aria-controls="settings" role="tab" data-toggle="tab">Settings</a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="home">...</div>
<div role="tabpanel" class="tab-pane" id="profile">...</div>
<div role="tabpanel" class="tab-pane" id="messages">...</div>
<div role="tabpanel" class="tab-pane" id="settings">...</div>
</div>
</div>
答案 0 :(得分:0)
卢卡斯 请检查此链接,我已修复此问题。 Working copy
<section>
<div class="container">
<div class="row">
<div class="col-sm-12 mainpage">
<form>
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#Etape1" aria-controls="Etape1" role="tab" data-toggle="tab">Etape 1</a></li>
<li role="presentation"><a href="#Etape2" aria-controls="Etape2" role="tab" data-toggle="tab">Etape 2</a></li>
<li role="presentation"><a href="#Etape3" aria-controls="Etape3" role="tab" data-toggle="tab">Etape 3</a></li>
<li role="presentation"><a href="#Etape4" aria-controls="Etape4" role="tab" data-toggle="tab">Etape 4</a></li>
<!--<li role="presentation"><a href="#Etape5" aria-controls="Etape5" role="tab" data-toggle="tab">Etape 5</a></li>
<li role="presentation"><a href="#Etape6" aria-controls="Etape6" role="tab" data-toggle="tab">Etape 6</a></li>-->
</ul>
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="Etape1">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Information Salarié</h3>
</div><!-- .panel-heading -->
<div class="panel-body">
<div class="form-group">
<label for="typeEntretien" class="col-sm-2 control-label">Type d'entretien</label>
<div class="col-sm-10">
<select class="form-control" name="typeEntretien" id="typeEntretien">
<option disabled selected>Choisir un type d'entretien</option>
<option value="B">Entretien Biennal</option>
<option value="BEDL">Entretien Biennal + Etat des lieux</option>
</select>
</div><!-- .col-sm-1_ -->
</div><!-- .form-groupe -->
<br/><br/>
<div class="form-group">
<label for="nomSalarie" class="col-sm-2 control-label">Nom</label>
<div class="col-sm-10">
<select class="form-control" name="nomSalarie" id="idSalarie">
<option disabled selected>Choisir un salarié</option>
<?php while($ligne = $displaySalarie->fetch()){?>
<option value=""></option>
<?php } ?>
</select>
</div><!-- .col-sm-10 -->
</div><!-- .form-groupe -->
<div class="salarie"></div>
</div><!-- .panel-body -->
</div><!-- .panel-default -->
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Informations Entretien</h3>
</div><!-- .panel-heading -->
<div class="panel-body">
<div class="form-group">
<label for="dateEntretien" class="col-sm-2 control-label">Date entretien</label>
<div class="col-sm-3">
<div class="input-group date dateEntretien" data-date="" data-date-format="dd-mm-yyyy" data-link-format="yyyy-mm-dd">
<input class="form-control" type="text" value="<?php echo date("j-n-Y"); ?>" name="dateEntretien" id="dateEntretien" placeholder="Date de l'entretien" readonly>
<span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div><!-- .input-grope -->
</div><!-- .col-sm-3 -->
</div> <!-- .form-groupe -->
<div class="form-group">
<label for="respEntretien" class="col-sm-2 control-label">Chargé(e) d'entretien</label>
<div class="col-sm-10">
<select class="form-control" name="respEntretien" id="respEntretien">
<option disabled selected>Choisir le responsable de l'entretien</option>
<?php while($ligne = $displayRH->fetch()){?>
<option value=""></option>
<?php } ?>
</select>
</div><!-- .col-sm-10 -->
</div><!-- .form-group -->
<div class="form-group">
<label for="datePEntretien" class="col-sm-2 control-label">Entretien précédent </label>
<div class="col-sm-4">
<div class="input-group date datePEntretien" data-date="" data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd">
<input class="form-control" type="text" readonly name="datePEntretien" id="datePEntretien" placeholder="Date du précedent entretien">
<span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div><!-- .input-group -->
</div><!-- .col-sm-4 -->
<label for="dateEDLP" class="col-sm-2 control-label">Etat des lieux précédent </label>
<div class="col-sm-4">
<div class="input-group date dateEDLP" data-date="" data-date-format="yyyy-mm-dd" data-link-format="yyyy-mm-dd">
<input class="form-control" type="text" value="" readonly name="dateEDLP" id="dateEDLP" placeholder="Date du précedent état des lieux">
<span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
</div><!-- .input-group -->
</div><!-- .col-sm-4 -->
</div> <!-- .form-group -->
</div><!-- .panel-body -->
</div><!-- .panel-default -->
</div><!-- #Etape1 -->
<div role="tabpanel" class="tab-pane" id="Etape2">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Poste occupé</h3>
</div><!-- .panel-heading -->
<div class="panel-body">
<div class="form-group">
<label for="" class="col-sm-5 control-label">Le contenu du poste de travail a-t-il évolué depuis le dernier EP ?</label>
<div class="col-sm-5">
<label class="radio-inline">
<input type="radio" name="choixContenuPP" id="OContenuPP" value="1"> Oui
</label>
<label class="radio-inline">
<input type="radio" name="choixContenuPP" id="NContenuPP" value="0"> Non
</label>
</div><!-- .col-sm-5 -->
</div><!-- .form-group -->
<div class="form-group" id="divTAchoixContenuPP" style="display:none;">
<label for="TAchoixContenuPP" class="col-sm-4 control-label">Si oui, préciser les principaux changements </label>
<div class="col-sm-6">
<textarea class="form-control" name="TAchoixContenuPP" id="TAchoixContenuPP" rows="4" cols="20"></textarea>
</div><!-- .col-sm-6 -->
</div><!-- .form-group -->
<div class="form-group">
<label for="" class="col-sm-5 control-label">Le salarié a-t-il changé de poste depuis le dernier entretien ?</label>
<div class="col-sm-5">
<label class="radio-inline">
<input type="radio" name="choixchangement" id="OChangement" value="1"> Oui
</label>
<label class="radio-inline">
<input type="radio" name="choixchangement" id="NChangement" value="0"> Non
</label>
</div><!-- .col-sm-5 -->
</div><!-- .form-group -->
<div class="form-group" id="divTAchoixChangement" style="display:none;">
<label for="TAchoixContenuPP" class="col-sm-4 control-label">Si oui, indiquer le nouveau contenu du poste </label>
<div class="col-sm-6">
<textarea class="form-control" name="TAchoixChangement" id="TAchoixChangement" rows="4" cols="20"></textarea>
</div><!-- .col-sm-6 -->
</div><!-- .form-group -->
</div><!-- .panel-body -->
</div> <!-- .panel-default -->
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Formations suivies</h3>
</div><!-- .panel-heading -->
<div class="panel-body">
<div class="formation"></div>
</div><!-- .panel-body -->
</div><!-- .panel-default -->
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Bénéfice des formations suivies<sup>*</sup></h3>
</div><!-- .panel-heading -->
<div class="panel-body">
<div class="table-responsive">
<table class="table table-bordered" style="width: auto !important;">
<thead style="font-weight: bold;">
<tr>
<td>N</td>
<td>Compétence acquises</td>
<td>Certification ou Diplôme obtenu(e)</td>
</tr>
</thead>
<tbody class="table-striped">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table><!-- .table -->
</div><!-- .table-responsive -->
</div><!-- .panel-body -->
<div class="panel-footer">
<span style="font-size:11px;"><sup>*</sup>Rappeler le numéro de la formation</span>
</div><!-- .panel-footer -->
</div><!-- .panel-default -->
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Compétences</h3>
</div><!-- .panel-heading -->
<div class="panel-body">
<div class="col-md-6">
<div class="table-responsive">
<table class="table table-bordered" style="width: auto !important;">
<tbody class="table-striped">
<tr>
<td colspan="3" style="text-align:center;font-weight:bold;">4 Compétences les mieux maîtrisées dans le poste</td>
</tr>
<tr>
<td>1</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_Acompet1" id="user_Acompet1" placeholder="Compétence 1">
</div>
</td>
</tr>
<tr>
<td>2</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_Acompet2" id="user_Acompet2" placeholder="Compétence 2">
</div>
</td>
</tr>
<tr>
<td>3</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_Acompet3" id="user_Acompet3" placeholder="Compétence 3">
</div>
</td>
</tr>
<tr>
<td>4</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_Acompet4" id="user_Acompet4" placeholder="Compétence 4">
</div>
</td>
</tr>
</tbody>
</table><!-- .table -->
</div><!-- .table-responsive -->
</div><!-- .col-md-6 -->
<div class="col-md-6">
<div class="table-responsive">
<table class="table table-bordered" style="width: auto !important;">
<tbody class="table-striped">
<tr>
<td colspan="3" style="text-align:center;font-weight:bold;">4 Compétences les moins maîtrisées dans le poste*</td>
</tr>
<tr>
<td>1</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_NAcompet1" id="user_NAcompet1" placeholder="Compétence 1">
</div>
</td>
<td style="vertical-align:middle;">
<input type="checkbox" name="AD1" id="AD1" value="1">
</td>
</tr>
<tr>
<td>2</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_NAcompet2" id="user_NAcompet2" placeholder="Compétence 2">
</div>
</td>
<td style="vertical-align:middle;">
<input type="checkbox" name="AD2" id="AD2" value="1">
</td>
</tr>
<tr>
<td>3</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_NAcompet3" id="user_NAcompet3" placeholder="Compétence 3">
</div>
</td>
<td style="vertical-align:middle;">
<input type="checkbox" name="AD3" id="AD3" value="1">
</td>
</tr>
<tr>
<td>4</td>
<td>
<div class="col-sm-12">
<input type="text" size="50" class="form-control" name="user_NAcompet4" id="user_NAcompet4" placeholder="Compétence 4">
</div>
</td>
<td style="vertical-align:middle;">
<input type="checkbox" name="AD4" id="AD4" value="1">
</td>
</tr>
</tbody>
</table><!-- .table -->
</div><!-- .table-responsive -->
</div><!-- .col-md-6 -->
</div><!-- .panel-body -->
<div class="panel-footer">
<span style="font-size:11px;"><sup>*</sup><span style="font-size:11px;">Cocher si la compétence est à developper</span>
</div><!-- .panel-footer -->
</div><!-- .panel-default -->
</div><!-- Etape2 -->
<div role="tabpanel" class="tab-pane" id="Etape3">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Evolution du contenu du poste</h3>
</div>
<div class="panel-body">
<div class="form-group">
<label for="evoPrevisible" class="col-sm-6 control-label">Evolution prévisible du poste (organisation, missions, objectifs, outils…) d’ici 2 ans</label>
<div class="col-sm-6">
<textarea class="form-control" name="evoPrevisible" id="evoPrevisible" rows="6" cols="20"></textarea>
</div>
</div>
<div class="form-group">
<label for="competenceDev" class="col-sm-6 control-label">Compétences à acquérir et/ou à développer d’ici 2 ans :</label>
<div class="col-sm-6">
<textarea class="form-control" name="competenceDev" id="evoPrevisible" rows="6" cols="20"></textarea>
</div>
</div>
</div>
<div class="panel-footer">
<div class="table-responsive">
<table class="table table-bordered" style="width: auto !important;">
<tbody>
<tr>
<td rowspan="2" style="vertical-align: middle;">Dispositif de formation pouvant être utilisé pour <br/> acquérir et/ou développer les compétences : </td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="VAEP" id="VAEP" value="VAEP"> VAE
</label>
</td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="CPFP" id="CPFP" value="CPFP"> CPF
</label>
</td>
<td rowspan="0">
<label class="checkbox-inline">
<input type="checkbox" name ="PDFP" id="PDFP" value="PDFP"> Plan de formation
</label>
</td>
</tr>
<tr>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="CIFP" id="CIFP" value="CIFP"> CIF
</label>
</td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="PDPP" id="PDPP" value="PDPP"> Période de professionnalisation
</label>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="Etape4">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Projet professionnel du salarié</h3>
</div>
<div class="panel-body">
<div class="table-responsive">
<table class="table table-bordered" style="width: auto !important;">
<tbody class="table-striped">
<tr>
<td rowspan="4" style="vertical-align: middle;">Le salarié a-t-il un projet professionnel ?</td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="LEP" id="LEP" value="LEP"> à Limousin Expansion
</label>
</td>
</tr>
<tr>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="CRLP" id="CRLP" value="CRLP"> au Conseil Régional du Limousin
</label>
</td>
</tr>
<tr>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="EXP" id="EXP" value="EXP"> a l'extérieur
</label>
</td>
</tr>
<tr>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="PDPP" id="PDPP" value="PDPP"> pas de projet professionnel
</label>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="panel-footer">
<div class="table-responsive">
<table class="table table-bordered" style="width: auto !important;">
<tbody>
<tr>
<td rowspan="2" style="vertical-align: middle;">Dispositif de formation pouvant être utilisé pour <br/> acquérir et/ou développer les compétences : </td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="VAES" id="VAES" value="VAES"> VAE
</label>
</td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="CPFS" id="CPFS" value="CPFS"> CPF
</label>
</td>
<td rowspan="0">
<label class="checkbox-inline">
<input type="checkbox" name ="PDFS" id="PDFS" value="PDFS"> Plan de formation
</label>
</td>
</tr>
<tr>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="CIFS" id="CIFS" value="CIFS"> CIF
</label>
</td>
<td>
<label class="checkbox-inline">
<input type="checkbox" name ="PDPS" id="PDPS" value="PDPS"> Période de professionnalisation
</label>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type="submit" name="submit_entpro" id="submit_entpro" class="btn btn-default">
</div>
</div>
</form>
</div>
</div>
</div>
</section>
将您的代码与我的代码进行比较,看看问题是什么。