Mostrando las entradas con la etiqueta Diseño. Mostrar todas las entradas
Mostrando las entradas con la etiqueta Diseño. Mostrar todas las entradas

29 julio 2009

Precargar Imagenes con CSS

Cuando cargamos varias imágenes en una pagina o cuando cargamos imágenes de alta calidad, estas demoran en cargar. Para ello agregaremos un precargador para indicar que la imagen esta cargando. y esto mediante css y html.

Pasos:

Obteniendo la Imagen
Primero es conseguir una imagen la que indique que se esta cargando la imagen buscando en google o entrando a esta web.
Creando el estilo
Ahora que ya tenemos la imagen, creamos un estilo llamado loading donde colocamos como fondo centrado verticalmente y horizontal sin que se repita.
.loading {
background: url(loading.gif) no-repeat center center;
}

Donde dice loading.gif reemplaza por tu imagen

Para aplicar:
Es recomendable colocar con las dimensiones de la imagen para que asi el navegador la reconosca y le dé espacio para la imagen de precarga.
<img class="loading" src="tuimagen.jpg" width="250" height="250"/>

Fuente:Wallpapers-Pc

Escribir codigo HTML en un post del blogger

Tal vez alguno tengan que mostrar un código en blogger(o en otra plataforma) y no les salga como quieren.

Escribir código con html y css en blogger
Solo primero debemos tener estilos en css
pre {
background:transparent url(http://i284.photobucket.com/albums/ll35/observadorweb/codigo.png) no-repeat 0 0;
width:99%;
font-size:12px;
padding:12px 0 0 0;
margin:13px 0;}

pre code {
overflow:auto;
background-color:#F8F8F8;
border-width:3px 1px;
border-style:solid;
border-color:#eee;
color:#333;
display:block;
text-align:left;
padding:5px;}

Y cada vez que escribamos un codigo lo ponemos entre
<pre><code>Aqui el código en texto plano</code></pre>
Pero antes de debes de convertirlo a texto plano aqui

Si hay dudan dejen en sus comentarios

28 julio 2009

Fuente o Tipografía

En tipografía, un tipo de letra es un conjunto de uno o más tipos de letras diseñadas con unidad de estilo, cada una compuesta por un conjunto coordinado de glifos. Un tipo de letra por lo general no sólo incluye un alfabeto de letras, cifras, signos de puntuación y marcas, sino que también puede incluir ideogramas y símbolos, o estar constituído enteramente de ellos, por ejemplo, matemáticos o símbolos cartográficos. El término tipo de letra es con frecuencia confundido con el de fuente; los dos términos tuvieron significados claramente diferenciadas antes de la llegada de la autoedición. Actualmente parece hacerse una distinción (injustificada) entre la fuente y tipo de letra: una fuente designa a un miembro específico de una familia de tipo, como negrita, o bastardilla (ahora también llamada desde el inglés, itálica), mientras que un tipo de letra designa un aspecto o estilo visual consistente, que puede ser una "familia" o un conjunto de fuentes relacionadas. Por ejemplo, un determinado tipo de letra como Arial, como puede incluir fuentes negritas o bastardillas.

Este uso de la palabra fuente, frecuente sobre todo desde la introducción del diseño gráfico y la composición por ordenador, procede de una mala traducción al castellano y es una mala traducción de la palabra inglesa font (literalmente "fundición": surtido o conjunto de todos los moldes o letras de una clase para imprimir) y la palabra española fuente, que no tiene nada que ver con la tipografía, ni siquiera en inglés (fuente en español se traduciría por fountain o fount, no por font) pero parece que se ha impuesto para denominar los tipos de letra de los ordenadores.

Fuentes seguras para diseño web

  • font-family: Arial, Helvetica, sans-serif;
  • font-family: ‘Arial Black’, Gadget, sans-serif;
  • font-family: ‘Bookman Old Style’, serif;
  • font-family: ‘Comic Sans MS’, cursive;
  • font-family: Courier, monospace;
  • font-family: ‘Courier New’, Courier, monospace;
  • font-family: Garamond, serif;
  • font-family: Georgia, serif;
  • font-family: Impact, Charcoal, sans-serif;
  • font-family: ‘Lucida Console’, Monaco,monospace;
  • font-family: ‘Lucida Sans Unicode’, ‘LucidaGrande’, sans-serif;
  • font-family: ‘MS Sans Serif’, Geneva, sans-serif;
  • font-family: ‘MS Serif’, ‘New York’, sans-serif;
  • font-family: ‘Palatino Linotype’, ‘BookAntiqua’, Palatino, serif;
  • font-family: Symbol, sans-serif;
  • font-family: Tahoma, Geneva, sans-serif;
  • font-family: ‘Times New Roman’, Times,serif;
  • font-family: ‘Trebuchet MS’, Helvetica,sans-serif;
  • font-family: Verdana, Geneva, sans-serif;
  • font-family: Webdings, sans-serif;
  • font-family: Wingdings, ‘Zapf Dingbats’,sans-serif;

03 octubre 2007

Dafont, más de 7000 fuentes gratuitas

Dafont es un sitios de fuentes (tipos de letra), cuenta con un catalogo de más de 7000 fuentes gratuitas en descarga directa y más de 1500 de ellas con acentos y caracteres especiales. Para facilitar la búsqueda de fuentes, las tienen clasificadas de acuerdo a su estilo y uso, en orden alfabético y por el nombre del autor, además de tener una lista de las 100 más descargadas y su propio buscador. Un detalle importante es que te da la posibilidad de ver un previo de la fuente con el texto que tu selecciones, para que no tengas que bajarla e instalarla sin que en verdad te agrede (al parecer esta opción esta temporalmente fuera de servicio). Es de esos recursos que uno debe tener guardado en los favoritos.Sitio: dafont.com
Via: BlogandWeb

Destacada

Hágase respetar

¿Es usted un gerente bonachón y le resulta difícil dar órdenes? ¿Es una madre de familia y sus hijos no quieren obedecerla? ¿Es usted una pe...

Populares