Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Nota
De forma predeterminada, la plantilla de proyecto de sitio web ASP.NET incluye funcionalidad de preco
embargo, en este tutorial se utiliza la plantilla de proyecto de sitio web vacía de ASP.NET para mostrar
manualmente.
Las tareas ilustradas en este tutorial incluyen:
Crear una página maestra
Crear una página ASP.NET con contenido que desea mostrar en la página maestra.
Seleccionar una página maestra en tiempo de ejecución.
Requisitos previos
Para poder completar este tutorial, necesitará:
Visual Studio o Microsoft Visual Web Developer Express.
Nota
Si usa Visual Studio, en este tutorial se presupone que seleccionó la colección de configuracione
Visual Studio. Para obtener más información, vea Cómo: Seleccionar configuraciones de entorno
Opcionalmente, un archivo .jpg, .gif u otro archivo gráfico que pueda utilizar como
logotipo en su página principal. Se recomienda que el logotipo no tenga más de 48
píxeles de ancho. Sin embargo, mostrar un logotipo es opcional y el tamaño exacto del
gráfico no es importante para el tutorial.
Nota
En este tutorial se supone que está utilizando archivos de código subyacente para todas las págin
archivo, el código que se muestra en el tutorial funcionará, pero aparecerá en la vista Código fue
5. En la lista Lenguaje, haga clic en el lenguaje de programación con el que prefiera
trabajar y, a continuación, haga clic en Agregar.
La nueva página maestra se abre en la vista Código fuente.
En la parte superior de la página hay una declaración @ Master en lugar de la
declaración @ Page que normalmente se encuentra en la parte superior de las páginas
ASP.NET. El cuerpo de la página contiene un control ContentPlaceHolder, que es el área
de la página maestra donde se combinará el contenido reemplazable de las páginas en
tiempo de ejecución. En el tutorial, trabajará después más con el marcador de posición
de contenido.
Nota
Nota
Para establecer el alto y ancho, arrastre los bordes de la celda o seleccione la celda y esta
11. Seleccione todas las celdas en la tabla y establezca BgColor en un color diferente que el
color de fondo.
Después de diseñar la tabla, puede agregar el contenido a la página maestra que aparecerá en
todas las páginas. Agregará un mensaje de copyright como pie de página y, a continuación, un
menú. Si tiene un gráfico de logotipo disponible, también puede agregarlo.
Para agregar contenido estático a la página maestra
1. Haga clic en la celda inferior y, a continuación, escriba el texto del pie de página, por
ejemplo Copyright 2007 Contoso Inc.
2. En el Cuadro de herramientas, arrastre un control Menu desde el grupo de
controles Navegación hasta la celda superior.
3. Cree un menú siguiendo estos pasos:
a. Establezca la propiedad Menu del control Orientation en Horizontal.
b. Haga clic en la etiqueta inteligente en el control Menu y haga clic en Editar
elementos de menú en el cuadro de diálogo Tareas de menú. Aparecerá el
cuadro de diálogo Editar elementos de menú.
4. En el cuadro de diálogo Editar elementos de menú, en la sección Elementos, haga dos
veces clic en el icono Agregar un nodo raíz para agregar dos elementos de menú:
a. Haga clic en el primer nodo y, a continuación, establezca Text en Principal y
establezca NavigateUrl en Default.aspx.
b. Haga clic en el segundo nodo y, a continuación, establezca Text en Acerca de y
establezca NavigateUrl en About.aspx.
c. Haga clic en Aceptar para cerrar el cuadro de diálogo Editor de elementos de
menú.
5. Si tiene un archivo gráfico disponible para utilizarlo como logotipo, siga estos pasos
para colocarlo en la página maestra:
a. En el Explorador de soluciones, haga clic con el botón secundario en el
nombre del sitio web y, a continuación, seleccione Agregar elemento
existente.
b. Navegue a su archivo gráfico, selecciónelo y, a continuación, haga clic
en Agregar.
c. En el Cuadro de herramientas, arrastre un control Image desde el
grupo Estándar hasta la columna central izquierda de la tabla.
d. Establezca la propiedad ImageUrl del control Image en el nombre del archivo
gráfico.
Ahora puede colocar el marcador de posición de contenido para especificar dónde puede
mostrar contenido la página maestra en tiempo de ejecución.
Para mover el marcador de posición de contenido
1. Arrastre el control ContentPlaceHolder a la celda central derecha. Para mover el control,
haga clic en su interior y, a continuación, arrástrelo por su etiqueta.
La propiedad ID del control es ContentPlaceholder1. Puede dejar este nombre o
cambiarlo. Si cambia el nombre, anótelo porque necesitará recordarlo más adelante.
2. Guarde la página.
C#
VB
Nota
De forma predeterminada, Visual Web Developer crea páginas que utilizan el modelo de código
3. En la definición de clase, escriba el código siguiente.
VB
C#
C#
VB
C#
VB
C#
C#
VB
C#
C#
VB
C#
VB
Nota
C#
VB
Pasos siguientes
Este tutorial muestra la funcionalidad básica de páginas maestras. Quizás desee probar otras
características de las páginas maestras. Por ejemplo, podría:
Crear páginas maestras que tienen varios marcadores de posición de contenido. Puede
llenar a continuación uno o más marcadores de posición de contenido para cada página
que muestre.
Definir marcadores de posición de contenido predeterminado. Si una página ASP.NET
no proporciona el contenido para el marcador de posición, la página maestra muestra el
contenido predeterminado.
Tener acceso a los miembros de la página maestra desde las páginas de contenido
mediante programación. Esto permite cambiar dinámicamente la apariencia de la
página maestra en tiempo de ejecución. Para obtener información detallada, vea Cómo:
Hacer referencia al contenido de la página maestra ASP.NET.
Utilizar el filtrado de dispositivos con las páginas maestras a fin de crear diferentes
diseños para distintos dispositivos, por ejemplo un diseño para exploradores y otro para
un tipo de teléfono concreto. Para obtener información detallada, vea Información
general sobre el filtrado de dispositivos de ASP.NET.
Obtener información sobre cómo puede colocar unas páginas maestras dentro de otras
para crear partes divididas en componentes. Para obtener información detallada,
vea Páginas maestras ASP.NET anidadas.