Blog

Vinton Cerf

Vinton Cerf

Vinton ‘Vint’ Gray Cerf (New Haven, Connecticut, Estados Unidos, 23 de junio de 1943) es un científico de la computación estadounidense, considerado uno de los ‘padres’ de Internet. Se graduó en matemáticas y ciencias de la computación en la Universidad de Stanford (1965). Durante su estancia posterior en la Universidad de California (UCLA) obtuvo la maestría en ciencias y el doctorado.

Read More

Centrar horizontal y verticalmente con line-height

Os dejamos un ejm de como centrar tanto horizontal como verticalmente utilizando la propiedad line-height con unas pocas líneas de código.

El código es el siguiente:

<!DOCTYPE html>
<html lang="es">
<head>
<style>
.centrado {
line-height: 300px;
height: 300px;
border: 1pxsolidblue;
text-align: center;
width: 800px;
margin: auto;
}

.centrado p {
line-height: 1.5;
display: inline-block;
vertical-align: middle;
}
</style>
</head>
<body>
<h1>Centrar horizontal y verticalmente con line-heigh</h1>
<p>Este texto no está centrado</p>

<div class="centrado">
<p>Este texto sí está centrado</p>
</div>
</body>
</html>

El resultado sería el siguiente:

CSS

Alinear a la derecha con la propiedad CSS position: absolute

Veamos un ejemplo de como alinear a nuestra derecha un texto con la propiedad CSS position: absolute, una de las propiedades más comúnmente utilizadas por todo desarrollador web.

<!DOCTYPE html>
<html lang="es">
<head>
<style>
.right {
position: absolute;
right: 0px;
width: 300px;
border: 3px solid blue;
padding: 10px;
}
</style>
</head>

<body>
<h1>Alinear a la derecha un bloque de texto</h1>
<p>Este es un ejm sencillo de como alinear horizontalmente a la derecha un bloque de texto</p>
<p class="right">Este texto quedará alineado a la derecha completamente.</p>
</body>
</html>

El resultado sería el siguiente

Centrar elementos horizontalmente con CSS

Para ello vamos a utilizar la propiedad CSS margin: auto. Veamos un ejm:

<!DOCTYPE html>
<html>
<head>
<style>
.center {
margin: auto;
width: 60%;
border: 3px solid #73AD21;
padding: 10px;
}
</style>
</head>
<body>

<h2>Elementos centrados horizontalmente</h2>
<p>Para centrar elementos de bloque (como <div>) de manera horizontal utilizamos
la propiedad y valor margin: auto;</p>

<div class="center">
<p>Hello World!</p>
</div>

</body>
</html>

El resultado sería el siguiente:

CSS

Crear enlaces de navegación con display: inline-block

Os dejamos un ejemplo de cómo crear enlaces de navegación con la propiedad CSS display: inline-block:

<!DOCTYPE html>
<html lang="es">
<head>
<style>
.nav {
background-color: yellow;
list-style-type: none;
text-align: center;
margin: 0px;
padding: 0px;
}

.nav li {
display: inline-block;
font-size: 20px;
padding: 20px;
}
</style>
</head>

<body>
<h1>Enlaces de navegación horizontal</h1>
<p>por defecto, las etiquetas li son mostradas verticalmente, en este ejemplo 
utilizaremos la propiedad display:inline-block para crear un menú de enlace horizontal</p>

<p>Nota: si cambia el tamaño de la ventana del navegador, los enlaces se romperán 
automáticamente cuando se llene demasiado.</p>

<ul class="nav">
<li><a href="#">Home</a></li>
<li><a href="#">Quienes somos</a></li>
<li><a href="#">Donde estamos</a></li>
<li><a href="#">Contacto</a></li>
</ul>
</body>
</html>

El resultado sería el siguiente:

Editor de texto

Editor de texto

Editor de texto es un programa informático que permite crear y modificar archivos digitales compuestos únicamente por textos sin formato, conocidos comúnmente como archivos de texto o texto plano. El programa lee el archivo e interpreta los bytes leídos según el código de caracteres que usa el editor. Es comúnmente de 7- u 8-bits en ASCII o UTF-8, rara vez EBCDIC.

Read More