TEMA DE LAS BADGAGE
CODIGO 01:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Texto en cajas</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>Cajas de Texto</h2>
<span class="badge badge-primary">Productos</span>
<span class="badge badge-secondary">Servicios</span>
<span class="badge badge-success">Creditos</span>
<span class="badge badge-danger">Extintores</span>
<span class="badge badge-warning">Salida de emergencia</span>
<span class="badge badge-info">Sucursales</span>
<span class="badge badge-light">Anuncios</span>
<span class="badge badge-dark">Empleos</span>
</div>
</body>
</html>
CODIGO PHP 01:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Texto en cajas</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" style="background-color:silver;">
<h2>Cajas de Texto</h2>
<?php
$C[1]="badge-primary";
$C[2]="badge-secondary";
$C[3]="badge-success";
$C[4]="badge-info";
$C[5]="badge-warning";
$C[6]="badge-danger";
$C[7]="badge-dark";
$C[8]="badge-light";
$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($a=1;$a<9;$a++)
echo "<span class='badge $C[$a]'>$V[$a]</span> - ";
echo "<br><hr>";
?>
</div>
</body>
</html>
CODIGO 03:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Texto en cajas</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" style="background-color:silver;">
<h2>Cajas de Texto</h2>
<?php
$C[1]="badge-primary";
$C[2]="badge-secondary";
$C[3]="badge-success";
$C[4]="badge-info";
$C[5]="badge-warning";
$C[6]="badge-danger";
$C[7]="badge-dark";
$C[8]="badge-light";
$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($a=1;$a<9;$a++)
echo "<span class='badge $C[$a]'>$V[$a]</span> - ";
echo "<br><hr>";
for($a=1;$a<9;$a++)
echo "<span class='badge badge-pill $C[$a]'>$V[$a]</span> - ";
echo "<br><hr>";
?>
</div>
</body>
</html>
CODIGO 04:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Texto en cajas</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" style="background-color:silver;">
<h2>Cajas de Texto</h2>
<?php
$B[1]="btn-primary";
$B[2]="btn-secondary";
$B[3]="btn-success";
$B[4]="btn-info";
$B[5]="btn-warning";
$B[6]="btn-danger";
$B[7]="btn-dark";
$B[8]="btn-light";
$B[9]="btn-link";
$C[1]="badge-primary";
$C[2]="badge-secondary";
$C[3]="badge-success";
$C[4]="badge-info";
$C[5]="badge-warning";
$C[6]="badge-danger";
$C[7]="badge-dark";
$C[8]="badge-light";
$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($a=1;$a<9;$a++)
echo "<span class='badge $C[$a]'>$V[$a]</span> - ";
echo "<br><hr>";
for($a=1;$a<9;$a++)
echo "<span class='badge badge-pill $C[$a]'>$V[$a]</span> - ";
echo "<br><hr>";
for($a=1;$a<9;$a++)
{
echo "<button type='button' class='btn $B[$a]'>";
echo "VER <span class='badge $C[$a]'>$a</span>";
echo "</button> ";
}
echo "<br><hr>";
?>
</div>
</body>
</html>
No hay comentarios.:
Publicar un comentario