Ayuda con el tamaño de los fonts del navegador

webartist · #1 (**permalink**) 04/02/2002, 21:39

Hola a todos...
Quisiera saber si existe algún código para que el usuario no pueda agrandar o achicar la letra del sitio ( la opción en el Internet Explorer está en ... Ver / Tamaño de Texto / Opciones... ) Porque si la puede modificar la pagina se distorciona con los fondos de botones...
agradecería que alguién me diga si conoce cómo hacer esto, ya que <a href='ir.asp?http://gamespot.com/gamespot/filters/downloads/0,10851,6013054,00.html' target='_blank'>http://gamespot.com/gamespot/filters/dow...</a> no permite modificar el tamaño del font.
Gracias por leerme.
Saludos

GastoN.
Buenos Aires.
-------------
Te voy a hacer conocer la nueva era de música digital.

trippy · #2 (**permalink**) 04/02/2002, 22:05

67 post en FDW y todavía no sabes nada de css??? jo, macho, a ver si visitamos menos el foro de ocio <img src='images/tongue.gif' width=15 height=15 align=middle>

bueno, pásate por el subforo de css y a lo mejor encuentras lo que buscas, que hay que currárselo... :P

webartist · #3 (**permalink**) 04/02/2002, 22:14

Hola, es que nunca entre a este foro...
Entro al de ASP. Nunca me intereso aprender CSS y aca me tienen...
Vos lo sabes?
Saludos

GastoN.
Buenos Aires.
-------------
Te voy a hacer conocer la nueva era de música digital.

trippy · #4 (**permalink**) 05/02/2002, 22:04

puedes hacerlo con las hojas de estilo, que son para eso, para definir los estilos de todos los elementos. Puedes definirlos en cada documento o utilizar un archivo .css:

1.- En cada documento - Debes poner este código en la cabecera, entre head y head, por ejemplo:

<style type="text/css">

</style>

Esto sólo es un ejemplo y puedes hacerlo a tu gusto, en este caso se han definido las del cuerpo (BODY), los enlaces en dos estados y tres tipos de texto. Por ejemplo, al definir A, un enlace, éstos siempre serán de color blanco y en negrita, y al definir los enlaces al pasar el cursor por encima, A:hover, los enlaces cambirán a color negro y estarán subrayados. Los textos, que es lo que te interesa: basta con poner un . (punto) y después un nombre para crearlo. En este caso los he llamado de una forma que refleje cómo son: .textogrande siempre tendrá 16pt de tamaño (puedes usar pixels, centímetros, etc.) y será negrita. .textonormal tendrá siempre 10pt y .textojustificado también pero estará justificado. Los tres, a su vez, siempre serán Verdana, y en caso de que el usuario no tenga esta fuente, Arial, sino Helvetica... Así que puedes definir los estilos a tu gusto siempre que sepas qué atributos acepta cada elemento.

¿Cómo se aplica ésto? Así:

<p class="textogrande">Esto es un título</p>

o también así:

<p class="textonormal">Esto es texto normal, pero <span class="textogrande">este otro es más grande</span> y este otro vuelve a ser normal</p>

Sigue... :)

trippy · #5 (**permalink**) 05/02/2002, 22:19

... Como en el caso de BODY y A, (A y A:hover), puedes definir todo un elemento. Si, por ejemplo, en lugar de definir varios tipos de texto quieres que todo el texto de un documento sea igual, basta con que definas el elemento P:

P {font-family:Verdana,Arial,Helvetica; font-size:10pt;}

Esto hará que todo el texto que está incluído entre etiquetas <p> sea verdana (en principio) y tenga 10pt de tamaño, así que no deberías utilizar class="" o span class="". Claro que así sólo tienes una definición para los textos, pero puedes definir otros elementos, como tablas, celdas, campos de un formulario, etc. y así hacer que cada elemento tenga su propia fuente o su propio estilo. Para saber más de esto, acude al <a href='ir.asp?http://www.w3.org' target='_blank'>http://www.w3.org...</a>la web del w3c que es quien define todo esto.

2.- En un documento - Puedes hacer un archivo .css. Utiliza cualquier editor de texto y sálavalo como .css (por ejemplo, estilos.css) y luego llámalo desde cada documento incluyendo esto en la cabecera:

<link rel="stylesheet" href="estilos.css" type="text/css">

teniendo en cuenta que debes llamar correctamente al archivo, así que si debes incluir una dirección entera hazlo (http://www.loquesea.com/textos/estilos.css).

El archivo de texto lo haces igual que antes pero esta vez no incluyas las etiquetas <style>, aquí tienes un ejemplo de cómo está escrito uno que utilizo yo y valida por el w3c:

BODY {
BORDER-BOTTOM: 0px;
BORDER-LEFT: 0px;
BORDER-RIGHT: 0px;
BORDER-TOP: 0px;
MARGIN: 0%;
COLOR: black
}
A:link {
COLOR: #6699CC;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}
A:visited {
COLOR: #6699CC;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}
A:active {
COLOR: #6699CC;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}

Sigue... :(

trippy · #6 (**permalink**) 05/02/2002, 22:27

A:hover {
COLOR: #006699;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}
A.enlace:link {
COLOR: #000000;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}
A.enlace:visited {
COLOR: #000000;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}
A.enlace:active {
COLOR: #000000;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: none
}
A.enlace:hover {
COLOR: #000000;
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt;
FONT-WEIGHT: bold;
TEXT-DECORATION: underline
}
.campo {
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 9pt;
COLOR: #666633;
BACKGROUND-COLOR: white;
BORDER-WIDTH: 1px;
BORDER-COLOR: #666633;
BORDER-STYLE: solid
}
.boton {
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 7pt;
FONT-WEIGHT: bold;
COLOR: #666633;
BACKGROUND-COLOR: #CCCC99;
BORDER-WIDTH: 1px;
BORDER-COLOR: #666633;
BORDER-STYLE: solid;
CURSOR: pointer
}
P {
FONT-FAMILY: verdana, arial, helvetica;
FONT-SIZE: 8pt
}

Aquí están definidos el cuerpo, dos tipos de enlace (A y A.enlace - puedes crear los que quieras), los campos y los botones de un formulario y los textos. Para un campo de un formulario, por ejemplo, aplicas el estilo igual:

<input type="text" class="campo"...

(La página donde uso este css es <a href='ir.asp?http://www.sabedores.com' target='_blank'>http://www.sabedores.com...</a> por si quieres ver cómo queda el texto, los enlaces y los formularios). Bueno, creo que con esto es suficiente, o eso espero. te repito, que el mejor sitio para aprender ésto es el w3c, así que pásate por allí alguna vez (supongo que habrá enlaces a sitios en español).

Lo dicho, si no te queda claro lo dices. Un saludo ;)

P.D.: te recomiendo que utilices la segunda opción, la de crear el archivo.

webartist · #7 (**permalink**) 06/02/2002, 23:14

Bueno antes que nada, te agradezco muchisimo porresponderme tan explicativo como para que lo entienda, Muchas gracias!

Ya lo estoy probando, y es muy facil y te deja de lado los problemas de justificar y moficar font por font... ahora lo que quiero saber es que pasa,.. si yo salgo del ejemplo, y lo llevo a una pagina que ya esta hecha y que tiene todo definido, debo borrar el codigo de font, es asi?
gracias y una vez mas gracias por preocuparte y mandarme tanta info acerca de css, que de ahora en más empiezo a descubrir sus utilidades ;)
Saludos.

GastoN.
Buenos Aires.
-------------
Te voy a hacer conocer la nueva era de música digital.

trippy · #8 (**permalink**) 07/02/2002, 01:15

Pués sí, tienes que quitar todos los <font> para que no te pase lo que quieres evitar, es decir, que el texto cambie de tamaño según el visitante de tu página. No sé qué editor utilizas, pero con el mío, si tengo el mismo problema que tú, selecciono todo y le doy a "quitar formato" o Ctrl+E y desaparece todo menos las <p>, incluyendo <b>, <big> o cualquier atributo de texto. Después sólo tengo que seleccionar el texto que quiero y desde un menú drop-down selecciono el estilo que quiero para ese texto, de entre los que yo he creado en el archivo .css. Así de fácil puedo hacerlo, pero no sé si tú tendrás que ir borrando todo "a mano", que me temo que sí.

Si recuerdas en el primer mensaje mío te dije que "visitaras menos el foro de ocio". Eso era sarcasmo por que no entiendo cómo mucha gente se pone a aprender perl, php o asp cuando todavía no domina html, javascript o css. Vamos, no es una crítica, más bien un consejo...

Bueno, lo que importa: hay que quitar las <font> :(

Un saludo y suerte y si tienes más dudas, pués ya sabes... ;)

webartist · #9 (**permalink**) 07/02/2002, 10:44

Bueno otra vez gracias, acepto tu crítica, es que yo aprendí HTML hace unos años, pero Javascript los códigos los bajaba de galerias gratuitas y los modificaba a mí parecer, y CSS no era una cosa muy nombrada por esos días, y no me entretuve a ver que era, últimamente estuve interesado pero más bien me volque a lenguajes de programación que es lo que necesito para desarrollar un proyecto y cuando llegue a un punto que no quería que se agrandaran las fonts, mande mensaje a HTML porque imagine que era de CSS y como hay subforo...
Bueno ya en unas semanas podrás ver el trabajo terminado.
Utilizo Dreamweaver Ultradev 4, nose cúal usas vos, pero seguramente la mayoría usa ese, Frontpage tiene algunos errores en la inserción de códigos y es malo el manejo de las tablas.
Bueno voy dejando de escribir porque me espera una reseteada de fonts... igual no es mucho porque es todo por base de datos, asique modifico el ASP central y listo.

GastoN.
Buenos Aires.
-------------
Te voy a hacer conocer la nueva era de música digital.

ia · #10 (**permalink**) 07/02/2002, 11:01

hola a todos
quiero aportar sólo dos datos mínimos a todo lo dicho, y muy bien dicho, anteriormente.
1. con el dreamweaver es muy fácil limpiar las fonts. basta con elegir "clean up html" y allí elegir "tag" y escribir "font". te las borra todas de una.
2. encontrás todo lo del c3w en español, más un manual completísimo, en <a href='ir.asp?http://www.carlos-benavidez.net' target='_blank'>http://www.carlos-benavidez.net...</a>
chau
saludos :)

trippy · #11 (**permalink**) 07/02/2002, 16:04

Bueno, pués ia ya te ha dicho cómo hacerlo con dreamweaver (hace tanto que no lo uso que ya no sé cómo funciona...).

Y gracias ia por el enlace, está muy bien el sitio ese para alguien que no sepa mucho inglés (por que yo prefiero el w3c).

Pués gracias y saludos a los dos.