Menú de navegaciónMenú
Categorías

La mejor forma de Aprender Programación online y en español www.campusmvp.es

660 artículos publicados

Estilos CSS para imprimir: pautas básicas y ejemplos

Los estilos específicos para imprimir muchas veces son los grandes olvidados, ya no solo a la hora de maquetar una web, sino incluso por los propios desarrolladores de navegadores. Si nunca has trabajado con ellos, probablemente las primeras veces te encuentres con algún dolor de cabeza. Realmente no es que sea muy difícil si lo planificamos bien, aprovechando los estilos CSS generales y dándole un poco de cariño a los estilos para impresión con unas pocas reglas, podemos ganar muchos puntos a los ojos de nuestros usuarios. [Más]

Cómo hacer un ribbon destacado usando solo CSS y el pseudoelemento ::before

En este post vamos a aprender una técnica muy sencilla pero resultona para simular una cinta (ribbon, en inglés) con un texto superpuesta con CSS sobre un elemento del contenido. La aplicación práctica más habitual para esta técnica es la clásica cinta que pone "Nuevo" por encima de un producto (o cualquier otra característica que se quiera destacar) en un e-commerce, pero realmente se puede aplicar en muchos otros casos, como posts de un blog, imágenes o vídeos de una galería, un listado de usuarios… [Más]

HTML y CSS: Cómo arreglar ese extraño espacio que aparece a veces debajo de las imágenes

Bueno, en realidad no es solo cosa de las imágenes. Suele ocurrir en elementos en línea que están dentro de un elemento de bloque sin altura definida. Si llevan un tiempo trabajando en el frontend, seguro que alguna vez te ha pasado algo así: Tienes una serie de imágenes, cada una dentro de un enlace, y para ordenar esos enlaces decides darles un display:block; o inline-block, para poder manejarlos a gusto. Pero, oh sorpresa, de repente te aparece un hueco debajo de la imagen que no sabes de dónde ha salido. [Más]

Qué es SVG y cómo usarlo para cambiar el color a bullets de listas

Puede que ahora parezca una perogrullada, pero una de las características que contribuyó a la popularización de la web y de HTML (junto a los enlaces de hipertexto) fue la posibilidad de insertar imágenes. Al principio eran simplemente imágenes de mapas de bits, donde reinaban los gif y los jpg por su relación calidad/peso, en función de las características de la imagen. Pero pronto apareció la necesidad de buscar un formato estándar vectorial y así nació SVG (Scalable Vector Graphics) entre 1998 y 2001. [Más]

Las 7 razones para aprender SQL que quizá nunca te habías parado a pensar

Si te dedicas al desarrollo (o simplemente estás dentro del sector tecnológico) probablemente estés de acuerdo conmigo en que últimamente el panorama se parece bastante al mito de Sísifo: cada vez que aprendes una tecnología nueva, a los seis meses (con suerte) te la cambian y vuelta a empezar. Pero esto no ocurre con SQL, que, además, tiene muchas otras ventajas. [Más]

Cómo sustituir una imagen en HTML usando solo CSS

Esta técnica es de esas cosas que normalmente aprendes pegándote día a día con CSS. Fontanería pura y dura, pero que, a pesar de su extrema sencillez, tiene su encanto para enseñarte el poder del aparentemente inofensivo CSS. Es de esas ñapas (dicho con cariño) para usar CSS como una navaja suiza y que te pueden resolver la papeleta cuando ya lo das todo por perdido. [Más]

Todo sobre los enlaces en HTML

Siempre me ha parecido que, una de las cosas más agradecidas de los documentos HTML de la web, aparte de porder insertar imágenes o vídeos, está en la posibilidad de crear hipervínculos o enlaces entre ellos. De hecho, yo creo que esta es una de las características que más puede emocionar y motivar a los novatos que jamás han tocado código ni con un palo, y que deciden adentrarse en el mundo del desarrollo web. [Más]

¿Cómo redimensionar un reCAPTCHA con CSS?

En este post vamos a ver cómo modificar fácilmente el tamaño de un reCAPTCHA o de cualquier otro widget externo que tengamos en nuestra web, en el caso de que se ponga rebelde. Aunque no sea algo difícil, la solución no es tan obvia como te puedas creer. Si no dominas a fondo HTML y CSS seguro que te viene bien este truco (y de paso, vete planteándote... [Más]

Cómo hacer un menú vertical desplegable con HTML y CSS (con y sin JavaScript)

En este pequeño tutorial vamos a ver cómo crear el típico menú lateral vertical desplegable. Seguro que lo has visto en mil sitios. De entrada, el menú permanece oculto y, al mostrarse, empuja al div del contenido principal. Primero lo veremos usando JavaScript y luego solo con HTML y CSS. Que conste que hay muchas formas de hacerlo, estas dos solo son un par de ellas. [Más]