Frames - Atributos avanzados

  • Por
Lista de atributos de las etiquetas frameset y frame con las que podemos configurar la apariencia y características de los marcos.
Aparte de la creación de los marcos propiamente dicha, existen muchos atributos con los que configurar su apariencia. Para ello, tanto la etiqueta <frameset> como <frame> admiten diversos atributos que permiten especificar la forma de elementos como los bordes de los frames, el margen, la existencia o no de barras de desplazamiento, etc.

Atributos para la etiqueta <frameset>

Ya hemos conocido el atributo cols y rows, que sirven para indicar si la distribución en marcos se hará horizontalmente o verticalmente. Sólo se puede utilizar uno de ellos y se iguala a las dimensiones de cada uno de las divisiones, separadas por comas.

border="número de pixels"
Permite especificar de manera global para todo el frameset el número de pixels que ha de tener el borde de los frames.

bordercolor="#rrggbb"
Con este atributo podemos modificar el color del borde de los frames, también de manera global a todo el frameset.

frameborder="yes|no|0"
Sirve para mostrar o no el borde del frame. Sus posibles valores son "yes" (para que se vean los bordes) y "no" o "0" (para que no se vean). En la práctica elimina el borde, pero permanece una línea de separación de los frames.

framespacing="número de pixels"
Para determinar la anchura de la línea de separación de los frames. Se puede utilizar en Internet Explorer y junto con el atributo frameborder="0" sirve para eliminar los bordes de los marcos.

Atributos para la etiqueta <frame>

Para esta etiqueta hemos señalado en capítulos anteriores los atributos src, que sirve para indicar el archivo que contiene el marco y name, para darle un nombre al marco y luego dirigir los enlaces hacia el. Veamos ahora otros atributos disponibles.

marginwidth="número de pixels"
Define el número de pixels que tiene el margen del frame donde se indica. Este margen se aplica a la página que pretendemos ver en ese marco, de modo que si colocamos 0, los contenidos del página en ese marco estarán pegados por completo al borde del margen y si indicamos un valor de 10, los contenidos de la página estarían separados del borde 10 pixels.

marginheight="número de pixels"
Lo mismo que el anterior atributo, pero para el margen vertical.

scrolling="yes|no|auto"
Sirve para indicar si queremos que haya barras de desplazamiento en los distintos marcos. Si indicamos "yes" siempre saldrán las barras, si indicamos "no" no saldrán nunca y si colocamos "auto" saldrán sólo si son necesarias. Auto es el valor por defecto.

Consejo: hay que tener cuidado si eliminamos los bordes de los frames, puesto que la página web puede tener dimensiones distintas dependiendo de la definición de pantalla del visitante. Si el espacio de la ventana se ve reducido, podría verse reducido el espacio para el frame y puede que no quepan los elementos que antes si que cabían y si hemos eliminado las barras de desplazamiento puede que el visitante no pueda ver todo el contenido del marco.

Este mismo consejo se puede aplicar al redimensionamiento de frames, que veremos en el siguiente atributo. Si hacemos que los marcos no sean redimensionables probablemente tengamos una declaración de frames demasiado rígida, que puede verse mal en algún tipo de pantalla.

noresize
Este atributo no tiene valores, simplemente se pone o no se pone. En caso de que esté presente indica que el frame no se puede redimensionar. Como hemos podido ver, al colocar el ratón sobre el borde de los marcos sale un cursor que nos señala que podemos mover dicho borde y redimensionar así los frames. Por defecto, si no colocamos nada, los marcos si se pueden redimensionar.

frameborder="yes|no|0"
Este atributo permite controlar la aparición de los bordes de los frames. Con este atributo igualado a "0" o "no" los bordes se eliminan. Sin embargo, quedan los feos márgenes en el borde. Por lo que hemos podido comprobar funciona mejor en Netscape que en Internet Explorer. De todos modos, tenemos una nota un poco más adelante para explicar los frames sin bordes.

Nota: los atributos de frames no funcionan siempre bien en todos los navegadores. Es recomendable que hagamos un test sobre lo que estamos diseñando en varios navegadores para comprobar que nuestros frames se ven bien en todas las plataformas.

bordercolor="#rrggbb"
Permite especicicar el color del borde del marco.

Referencia: Tenemos un taller de HTML en el que explicamos como realizar un frame sin bordes que se vea bien en los navegadores más habituales.

Autor

Miguel Angel Alvarez

Miguel es fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Comenzó en el mundo del desarrollo web en el año 1997, transformando su hobby en su trabajo.

Compartir

Comentarios

Knopfler

11/7/2004
He usado el atributo noresize en el primer atributo frameset del código que ponéis al final del siguiente capítulo, y no me ha servido, pero en cambio al ponerlo en el primer frame sí.
El código sin noresize es este:
<frameset rows="60,*">

    <frame src="pagina1.html">

    <frameset cols="200,*">

       <frameset rows="*,150">

          <frame src="pagina2.html">

          <frame src="pagina3.html">

       </frameset>

       <frameset rows="*,60">

          <frame src="pagina4.html">

          <frame src="pagina5.html">

       </frameset>

    </frameset>

</frameset>

El codigo con noresize en el primer frameset (que no tuvo efecto):

<frameset rows="60,*" noresize>

    <frame src="pagina1.html">

    <frameset cols="200,*">

       <frameset rows="*,150">

          <frame src="pagina2.html">

          <frame src="pagina3.html">

       </frameset>

       <frameset rows="*,60">

          <frame src="pagina4.html">

          <frame src="pagina5.html">

       </frameset>

    </frameset>

</frameset>

Y el código con noresize en el primer frame (que tuvo efecto):

<frameset rows="60,*">

    <frame src="pagina1.html" noresize>

    <frameset cols="200,*">

       <frameset rows="*,150">

          <frame src="pagina2.html">

          <frame src="pagina3.html">

       </frameset>

       <frameset rows="*,60">

          <frame src="pagina4.html">

          <frame src="pagina5.html">

       </frameset>

    </frameset>

</frameset>

Usé para modificar el código el HomeSite, no se si será de utilidad saberlo...

Saludos,
Knopfler

Gilmar

03/12/2006
hmm el "noresize" es un comando que se utiliza para qeu el usuario final no modifique la pagina , ya que en algunas ocasiones puede colgar la pagina durante unos segundos. es muy bueno usarlo para qeu no raiga problemas futuros.

asi seria el noresize


<frameset rows="60,*">

<frame src="pagina1.html" noresize>

<frameset cols="200,*">

<frameset rows="*,150">

<frame src="pagina2.html" noresize>

<frame src="pagina3.html" noresize>

</frameset>

<frameset rows="*,60">

<frame src="pagina4.html" noresize>

<frame src="pagina5.html" noresize>

</frameset>

</frameset>

</frameset>

oe mucho frame usas no se si te qeu da bien la pagina con eso

jonhatan

22/8/2009
HOLA
MUY BUENA LA ENSEÑANZA

Luis

06/3/2017
barra de desplazamiento y frame
Hola muy buenas, de antemano gracias por el artículo.
Quisiera preguntaros lo siguiente: si yo tengo mi página web dividida en framesets, y a su vez en frames, ¿como puedo añadir una barra de desplazamiento completamente a la derecha de la página web para controlar un frame de contenido que está en el medio? (exactamente como tiene la página web de Facebook). Llevo ya semanas intentando cosas pero es imposible y no he encontrado nada en la red, sería de muy gran ayuda si me echáis un cable.
Muchísimas gracias.