Bootstrap Botones y PHP

BOTONES
CODIGO 01 :

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Estilos de botones</h2>
  <?php
$C[1]="btn-primary";
$C[2]="btn-secondary";
$C[3]="btn-success";
$C[4]="btn-info";
$C[5]="btn-warning";
$C[6]="btn-danger";
$C[7]="btn-dark";
$C[8]="btn-light";
$C[9]="btn-link";

$D[1]="btn-outline-primary";
$D[2]="btn-outline-secondary";
$D[3]="btn-outline-success";
$D[4]="btn-outline-info";
$D[5]="btn-outline-warning";
$D[6]="btn-outline-danger";
$D[7]="btn-outline-dark";
$D[8]="btn-outline-light";
$D[9]="btn-outline-link";

$T[0]="btn-lg";
$T[1]="btn-primary";
$T[2]="btn-sm";

$V[1]="Misón";
$V[2]="Visión";
$V[3]="Objetivos";
$V[4]="Cultura Laboral";
$V[5]="Historia";
$V[6]="Contacto";
$V[7]="Comentarios";
$V[8]="Revista digital";
$V[9]="Servicios";

 for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $C[$a] $T[$b]'>$V[$a]</button> - ";
 }

 echo "<br><hr>";


 ?>
</div>


</body>
</html>

CODIGO 02 :

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Estilos de botones</h2>
  <?php
$C[1]="btn-primary";
$C[2]="btn-secondary";
$C[3]="btn-success";
$C[4]="btn-info";
$C[5]="btn-warning";
$C[6]="btn-danger";
$C[7]="btn-dark";
$C[8]="btn-light";
$C[9]="btn-link";

$D[1]="btn-outline-primary";
$D[2]="btn-outline-secondary";
$D[3]="btn-outline-success";
$D[4]="btn-outline-info";
$D[5]="btn-outline-warning";
$D[6]="btn-outline-danger";
$D[7]="btn-outline-dark";
$D[8]="btn-outline-light";
$D[9]="btn-outline-link";

$T[0]="btn-lg";
$T[1]="btn-primary";
$T[2]="btn-sm";

$V[1]="Misón";
$V[2]="Visión";
$V[3]="Objetivos";
$V[4]="Cultura Laboral";
$V[5]="Historia";
$V[6]="Contacto";
$V[7]="Comentarios";
$V[8]="Revista digital";
$V[9]="Servicios";

 for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $C[$a] $T[$b]'>$V[$a]</button> - ";
 }

 echo "<br><hr>";

for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $D[$a] $T[$b]'>$V[$a]</button> - ";
 }

 ?>
</div>


</body>
</html>

CODIGO 03 :

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Estilos de botones</h2>
  <?php
$C[1]="btn-primary";
$C[2]="btn-secondary";
$C[3]="btn-success";
$C[4]="btn-info";
$C[5]="btn-warning";
$C[6]="btn-danger";
$C[7]="btn-dark";
$C[8]="btn-light";
$C[9]="btn-link";

$D[1]="btn-outline-primary";
$D[2]="btn-outline-secondary";
$D[3]="btn-outline-success";
$D[4]="btn-outline-info";
$D[5]="btn-outline-warning";
$D[6]="btn-outline-danger";
$D[7]="btn-outline-dark";
$D[8]="btn-outline-light";
$D[9]="btn-outline-link";

$T[0]="btn-lg";
$T[1]="btn-primary";
$T[2]="btn-sm";

$V[1]="Misón";
$V[2]="Visión";
$V[3]="Objetivos";
$V[4]="Cultura Laboral";
$V[5]="Historia";
$V[6]="Contacto";
$V[7]="Comentarios";
$V[8]="Revista digital";
$V[9]="Servicios";

 for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $C[$a] $T[$b]'>$V[$a]</button> - ";
 }

 echo "<br><hr>";

for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $D[$a] $T[$b]'>$V[$a]</button> - ";
 }
//grupos de botones

  echo "<br><br><hr><div class='btn-group'>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $C[$a] '>$V[$a] <span class='badge badge-light'>$a</span></button>";
 echo "</div><br><hr>";

 ?>
</div>

</body>
</html>

CODIGO 04 :

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Estilos de botones</h2>
  <?php
$C[1]="btn-primary";
$C[2]="btn-secondary";
$C[3]="btn-success";
$C[4]="btn-info";
$C[5]="btn-warning";
$C[6]="btn-danger";
$C[7]="btn-dark";
$C[8]="btn-light";
$C[9]="btn-link";

$D[1]="btn-outline-primary";
$D[2]="btn-outline-secondary";
$D[3]="btn-outline-success";
$D[4]="btn-outline-info";
$D[5]="btn-outline-warning";
$D[6]="btn-outline-danger";
$D[7]="btn-outline-dark";
$D[8]="btn-outline-light";
$D[9]="btn-outline-link";

$T[0]="btn-lg";
$T[1]="btn-primary";
$T[2]="btn-sm";

$V[1]="Misón";
$V[2]="Visión";
$V[3]="Objetivos";
$V[4]="Cultura Laboral";
$V[5]="Historia";
$V[6]="Contacto";
$V[7]="Comentarios";
$V[8]="Revista digital";
$V[9]="Servicios";

 for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $C[$a] $T[$b]'>$V[$a]</button> - ";
 }

 echo "<br><hr>";

for($b=0;$b<3;$b++)
 {
  echo "<br><br>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $D[$a] $T[$b]'>$V[$a]</button> - ";
 }
//grupos de botones

  echo "<br><br><hr><div class='btn-group'>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $C[$a] '>$V[$a] <span class='badge badge-light'>$a</span></button>";
 echo "</div><br><hr>";
  echo "<br><br><hr><div class='btn-group-vertical'>";
  for($a=1;$a<10;$a++)
   echo "<button type='button' class='btn $D[$a] '>$V[$a]</button>";
 echo "</div><br>";

 ?>
</div>
</body>
</html>
Publicadas por

No hay comentarios.:

Publicar un comentario

Suscribirse a: Comentarios de la entrada (Atom)