Personalizacion de sitios web

Solo disponible en BuenasTareas
  • Páginas : 7 (1692 palabras )
  • Descarga(s) : 0
  • Publicado : 21 de febrero de 2012
Leer documento completo
Vista previa del texto
Desarrollo de Aplicaciones para Ambientes Distribuidos 

Personalizar un sitio Web mediante temas en Visual Studio
Esta práctica muestra cómo utilizar temas para aplicar un aspecto coherente a las páginas y controles de un sitio Web. Un tema puede contener archivos de máscara que definan un aspecto común para cada uno de los controles, una o varias hojas de estilo, y gráficos comunes para suuso con los controles, por ejemplo el control TreeView. Las tareas ilustradas en esta práctica incluyen: • Aplicar temas de ASP.NET predefinidos a páginas individuales y a un sitio en conjunto. • Crear un tema propio con máscaras, que se utilizan para definir la apariencia de controles individuales.

Crear el sitio Web
Para crear un sitio Web del sistema de archivos
1. 2. 3. 4. Abra VisualStudio. En el menú Archivo, haga clic en Nuevo sitio Web. Aparece el cuadro de diálogo Nuevo sitio Web. En Plantillas instaladas de Visual Studio, haga clic en Sitio Web de ASP.NET. En el cuadro Ubicación, escriba el nombre de la carpeta en la que desea conservar las páginas de su sitio Web. Por ejemplo, escriba el nombre de carpeta C:\WebSites. En la lista Lenguaje, haga clic en el lenguaje deprogramación con el que prefiera trabajar. Haga clic en Aceptar. Visual Studio crea la carpeta y una nueva página denominada Default.aspx.

5. 6.

Para empezar a trabajar con temas en esta práctica, va a configurar un control Button, un control Calendar y un control Label, de manera que pueda ver cómo los temas afectan a dichos controles.

Para colocar los controles en la página
1. 2. Cambie a lavista Diseño. Del grupo Estándar del Cuadro de herramientas, arrastre un control Calendar, un control Button y un control Label hacia la página. El diseño exacto de la página no es importante.

Nota:
No aplique ningún formato a ninguno de los controles. Por ejemplo, no utilice el comando AutoFormat para establecer el aspecto del control Calendar.

3. 4.

Cambie a la vista Código fuente.Asegúrese de que el elemento de la página tiene el atributo runat="server" de forma que diga lo se indica a continuación:



Desarrollo de Aplicaciones para Ambientes Distribuidos 
  5. Guarde la página.

Para probar la página, puede verla antes de que se aplique un tema, y a continuación con temas diferentes.

Crear y aplicar un tema a una página
Con ASP.NET resulta muy fácil aplicarun tema predefinido a una página o crear un tema único. En esta parte de la práctica, creará un tema con algunas máscaras simples, que definen el aspecto de los controles.

Para crear un tema nuevo
1.

2.

3. 4.

En Visual Studio, haga clic con el botón secundario en el nombre del sitio Web, haga clic en Agregar carpeta ASP.NET y, a continuación, haga clic en Tema. Se crean la carpetadenominada App_Themes y una subcarpeta denominada Theme1. Cambie el nombre de la carpeta Theme1 a sampleTheme. El nombre de esta carpeta será el nombre del tema que cree (aquí, sampleTheme). El nombre exacto no tiene importancia, pero debe recordarlo cuando aplique el tema personalizado. Haga clic con el botón secundario en la carpeta sampleTheme, seleccione Agregar nuevo elemento, agregue un nuevoarchivo de texto y denomínelo sampleTheme.skin. En el archivo sampleTheme.skin, agregue definiciones de máscaras como se muestra en el ejemplo de código siguiente. Copiar    

Nota:
Las características exactas que defina no tienen importancia. Los valores de la selección anterior son sugerencias que serán más obvias cuando pruebe el tema más adelante.

Las definiciones de máscaras sonparecidas a la sintaxis para crear un control, salvo que las definiciones sólo contienen opciones que afectan al aspecto del control. Por ejemplo, las definiciones de máscaras no incluyen una opción para la propiedad ID. 5. Guarde el archivo de máscara y ciérrelo. Ya puede probar la página antes de que se aplique ningún tema.

Nota:
Si agrega un archivo de hoja de estilos en cascada (CSS) a la...
tracking img