Mostrando las entradas con la etiqueta HTML. Mostrar todas las entradas
Mostrando las entradas con la etiqueta HTML. Mostrar todas las entradas

martes, 7 de junio de 2016

HTML: Cuadro de texto con color de fondo


En HTML, con este código podrá hacer un cuadro de texto con texto adentro y un color de fondo.


<div style="background-color: orange; border: 1px solid black; margin: 0px auto; padding: 10px; text-align: left; width: 200px;">
texto que irá dentro del cuadro...</div>


texto que irá dentro del cuadro...


Podemos personalizarlo a nuestro gusto cambiando:


background-color para el color de fondo. Podemos poner el color que queramos con código hexadecimal.
Ejemplo: #FFFFFF o también con el nombre del color.

border: El grosor del borde del cuadro de texto y el color del borde.

text-align: Alineación del texto dentro del cuadro.

width: Tamaño horizontal del cuadro (a lo largo).


<div style="background-color: #fbfbfb; border: 5px solid #FF0000; margin: 0px auto; padding: 10px; text-align: center; width: 400px;">
<span style="color: #0080ff;">texto que irá dentro del cuadro... Esto es un ejemplo del texto que puede ir dentro del cuadro de texto con un color de fondo cambiando algunos parámetros.</span></div>

texto que irá dentro del cuadro... Esto es un ejemplo del texto que puede ir dentro del cuadro de texto con un color de fondo cambiando algunos parámetros.


En este segundo ejemplo se cambió el background-color, el tamaño del border y el color, el texto se puso centralizado, el width se cambió a 400px (más grande), se agregó más texto y se introdujo el elemento <span style="color: #0080ff">...</span> para cambiar el color de texto y ponerlo azul.

En el primer ejemplo al no especificarse un color de fuente, toma la predeterminada o la establecida por la plantilla.

lunes, 6 de junio de 2016

Tooltip en HTML, texto sugerido

Este es el <SPAN title="texto sugerido dentro del Tooltip">texto que al dejar mouse encima presentará el Tooltip</SPAN>.

Aquí lo podemos apreciar, si dejamos el cursor encima del texto:


Este es el texto que al dejar mouse encima presentará el Tooltip.


Una captura:



La etiqueta con la frase “texto sugerido dentro del Tooltip” emergió porque, durante unos instantes, se dejó el cursor parado encima de la expresión “texto que al dejar mouse encima presentará el Tooltip”.

miércoles, 1 de junio de 2016

Para que las imágenes en Blogger no se abran o "amplíen" al hacer click

En esta entrada verás cómo evitar que las imágenes se abran en la misma ventana al hacerles clic, pues para algunos resulta molestoso. Véase aquí un ejemplo:

Imagen clickeable

Para evitar esto, tres pasos a seguir:

lunes, 30 de mayo de 2016

Colores: RGB, HTML & Color Picker

Los que editan imágenes, modifican blogs, páginas web o incluso los desarrolladores de aplicaciones para plataformas que no son web (programas para sistemas operativos), cuando están diseñando la interfaz gráfica de algún programa, tienen que lidiar con los colores RGB o hexadecimales. Por ejemplo, los programadores que usan Visual Studio deben saber que para que el fondo de un botón sea rojo, en la propiedad "BackColor" ponemos 255, 0, 0 (el código RGB del color rojo).

RGB (rojo, verde, azul por sus siglas en inglés) es un formato o modelo estandarizado para identificar colores y sus variaciones. Los que han trabajado con el programa Paint de Windows, saben que al hacer clic en el botón "Editar colores" vemos este cuadro de diálogo que contiene todas las variaciones de los colores y sus respectivos códigos.



No obstante, así como existe el RGB también existe el código hexadecimal, que es el formato o modelo que se usa en el lenguaje HTML para identificar los colores y sus variaciones en páginas web, blogs, JavaScript, etc.