7 hacks en HTML / Java que debes aprender
En el desarrollo de páginas web, HTML y Java son los lenguajes que más destacan, porque hacen posible la construcción de páginas web muy variadas de forma más sencilla.
Así que, es importante conocer los 7 hacks en HTML / Java que debes aprender para facilitar el desarrollo de páginas web.
¿Qué es HTML?
HTML es el lenguaje con el que se define o estructura el contenido de las páginas web, ya sean imágenes, texto en párrafos, listas o tablas de datos.
El Lenguaje de Marcado de Hipertexto o HyperText Markup Languaje (HTML) consta de un grupo de etiquetas que ayuda a definir el texto y demás elementos de la página web. El código HTML funciona en cualquier sistema operativo y en cualquier navegador.
¿Qué es Java?
Java es un lenguaje de programación de código abierto, orientado a objetos, usado para el desarrollo de aplicaciones y tareas de backend. Aunque no está exclusivamente enfocado a la web, permite crear aplicaciones que la transforman en una herramienta muy útil e interesante.
Los 7 hacks en HTML / Java más recientes o menos conocidos
Los hacks son utilizados para facilitar y simplificar la programación en lenguajes, de hecho, las Hojas de Estilo en Cascada o CSS son un lenguaje para gestionar el aspecto y la presentación de las páginas web.
Dentro de los hacks que existen, resaltan los hacks de CSS, que incluyen diversas técnicas para gestionar las interpretaciones que hacen los navegadores, garantizando que las páginas web se visualicen de la misma manera sin importar el navegador que se utilice.
1. Cambiar el color de la página
Este hack le asigna un color de fondo a toda la página web, a través de códigos hexadecimales y permite cambiar el código de color como quieras. El código es:
html {
background-color: #00539F;
}
2. Agregar una imagen como fondo
Para agregar una imagen como fondo al cuerpo (body) de la página, se usa la URL de la imagen, como se muestra en el hack siguiente:
body {
background-image: url(“barn.jpg”);
}
3. Centrar la imagen
Para centrar la imagen, el hack indica que la imagen “img” debe tratarse como un bloque (block), cuando se muestra: “display”.
Mientras que, la instrucción “margin” establece el margen para los cuatro lados de la página, cuando solo se especifica un valor.
img {
display: block;
margin: 0 auto;
}
4. Cambiar el estilo de la fuente
Para cambiar el estilo de la fuente de las letras utilizadas en la página web, hay que utilizar el siguiente hack:
.italic { font-style: italic; }
Se usa italic, si se desea que la letra sea cursiva, aunque también se pueden usar otros valores como: normal y oblique.
5. Crear sombras de texto
El hack en CSS para crear el sombreado de un texto de la familia “sans-serif” es el siguiente:
p {
font-size: 50pt;
font-family: sans-serif;
text-shadow: 10px 11px 18px rgba(255, 0, 0, 1),
-10px -11px 18px red;
}
El código “text shadow” permite crear dos sombras para elementos de un párrafo <p>, cuyo número de sombras puede aumentarse, si se desea.
En esta instrucción, los primeros dos elementos establecen la posición de la sombra, coordenadas X y Y, mientras que el tercer elemento determina el tamaño.
Finalmente, es posible definir el color de la sombra de dos maneras:
- A través de la instrucción: rgba(255, 0, 0, 1)
- Colocando directamente el color: red;
6. Destacar la primera letra de un párrafo
Para destacar la primera letra de un párrafo, el hack que se necesita es el siguiente:
P {
font-family: “bookman old style”
}
p:first-child::first-letter{
font-family: “papyrus”;
font-size: 25px
font-weight: bold
}
Inicialmente, se estable el font para todo el texto y después, a través de la instrucción “first-letter”, se establece el font que destacará la primera letra.
7. Dar estilo al cuerpo del documento
El hack para dar estilo al cuerpo (body) del documento es el siguiente:
body {
width: 600px;
margin: 0 auto;
background-color: #FF9500;
padding: 0 20px 20px 20px;
border: 5px solid black;
}
Mientras que “padding” es el espacio entre el contenido y los bordes de la página, que junto a “border”, es el que coloca un borde al cuerpo del documento.