Esta web utiliza cookies para obtener datos estadísticos de la navegación de sus usuarios.
Política de privacidad y Aviso legal
Temas > Programacion > Css > Propiedades relacionadas al padding con CSS
Propiedades relacionadas al padding de una marca HTML
El padding (almohadilla) suma espacio entre el contenido de la marca HTML y
el borde (recordar propiedad border).
Podemos configurar los 4 en caso que tengan el mismo valor accediendo a la
propiedad:
padding
o podemos configurar en forma independiente cada lado:
padding-top
padding-right
padding-bottom
padding-left
Veamos un ejemplo, la pagina1.html:
<?php //esto no va
<html>
<head>
<title>Problema</title>
<link rel="StyleSheet" href="estilos.css" type="text/css">
</head>
<body>
<pre class="codigofuente">
public class Rectangulo{
//atributos
int alto;
int ancho;
boolean relleno;
//métodos
public int devolverArea(){
return alto*ancho;
}
public void rellenar(boolean r){
relleno=r;
}
public void cambiarTamano(int an, int al){
ancho=an;
alto=al;
}
public Rectangulo() {// constructor
alto=20;
ancho=10;
relleno=false;
}
}//fin clase Rectangulo
</pre>
</body>
</html>
?>//esto no va
El archivo estilos.css es:
<?php //esto no va
.codigofuente {
font-family:Courier;
font-size:12px;
background-color:#ffffcc;
border-width:1px;
border-style:dotted;
border-color:#ffaa00;
padding:20px;
}
?>//esto no va
Con la marca HTML pre, se respetan los espacios y retornos de carro que
hayamos puesto en el texto fuente. Este estilo de texto es muy adecuado
cuando queremos mostrar el código fuente de un programa.
| Lun | Mar | Mie | Jue | Vie | Sab | Dom |
|---|---|---|---|---|---|---|
| 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 | 29 | 30 |
Martes 8 de Abril 2025
Semana 15
