-
Modificar el widget de twitter
Me he dado a la tarea de modificar el widget de twitter para cambiar un poco la apariencia. Es muy sencillo pero cuesta trabajo encontrar la información, así que decidí crear este pequeño artículo para explicarles. En primer lugar el widget que vamos a modificar es el que usa este JS: <script src="http://widgets.twimg.com/j/2/widget.js"></script> Para cambiarle…
-
SangrÃa en CSS
Con la propiedad text-indent, podremos hacer una sangría. El valor de la propiedad es el tamaño que queramos que sea la sangría para cada párrafo. Por ejemplo [codigo] p { text-indent: 1em; text-align: left; } [/codigo] Este código creará una sangría en todos los párrafos de la página. Y también alineará el texto a la…
-
Scroll en div overflow
Para poner un scroll a un div es muy sencillo, solamente tenemos que utilizar la propiedad overflow:scroll y asignar un tamaño determinado al div. En cuanto el contenido lo sobrepase saldrá automáticamente el scroll. Aquí les dejo el ejemplo de scroll en div con overflow: <html> <head> <title>Untitled Document</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body>…
-
Decoración de textos con CSS
Mediante hojas de estilo, CSS, podemos darle al texto diferentes formatos de manera muy simple: Como subrayar el texto, atravezarlo con una línea, poner una línea superior o hacerlo parpadear (no funciona en IE), así como agregar diferentes colores a las ligas de una página. Aquí les dejo un ejemplo sencillo sobre el manejo del formato del…
-
Justificar, centrar y alinear a la derecha con CSS
Las hojas de estilo nos permiten alinear a la izquierda, derecha, centrar y justificar un texto. Aquí les dejo el ejemplo: <html> <head> <style type="text/css"> h1 {text-align: center} h2 {text-align: left} h3 {text-align: right} h4 {text-align: justify} </style> </head> <body> <h1>Cómo centrar un texto</h1> <h2>Cómo alinear a la izquierda un texto</h2> <h3>Cómo centrar un texto</h3>…
-
Incrementar el espacio entre las letras con CSS
Si quisieramos incrementar el espacio entre letra y letra de un texto en una página web. La forma más simple sería utilizar hojas de estilos y modificar la propiedad del word-spacing, tal y como lo podemos ver en el siguiente ejemplo, espero sea de su agrado. <html> <head> <style type="text/css"> p { word-spacing: 30px } </style>…
-
Indentación o sangria en CSS
Una funcionalidad maravillosa del CSS es que nos permite indentar (comunmente conocido como dejar sangría), lo cual sirve para dar un descanso a la vista del lector, además de darle un buen toque de gusto a la colocación del texto en nuestras páginas. <html> <head> <style type="text/css"> p {text-indent: 1cm} </style> </head> <body> <p> Ejemplo…
-
Borde en CSS
Las hojas de estilo nos permiten colocar un borde a los elementos de las páginas web. En este ejemplo vemos todas las propiedades del borde aplicadas al tag <p>. <html> <head> <style type="text/css"> p { border: medium double rgb(250,0,255) } </style> </head> <body> <p>Texto rodeado por borde en CSS</p> </body> </html>
-
Propiedades del texto con CSS
En este ejemplo vemos como podemos asignarle una propiedad a todo el texto del tag <p> mediante hojas de estilo. En este caso, la fuente es italica, pequeña, de 12 pixeles y con letra arial. <html> <head> <style type="text/css"> p { font: italic small-caps 900 12px arial } </style> </head> <body> <p>Este es un párrafo…
-
Cambiar el color del texto con CSS
Con las hojas de estilo, CSS, podemos cambiar el diseño, color y formato de cada uno de los elementos de una página. En este ejemplo podemos ver como se cambia el color de los diferentes textos, mediante la aplicación de hojas de estilo a tags específicos como h1, h2 y p. Para definir el color…