Creación de una página básica en el marco ASP.Net con CSS
Manual de laboratorio de la Universidad Nacional de Computación y Ciencias Emergentes 1.1 “Introducción a ASP.net, HTML” Laboratorio de sistemas de bases de datos Primavera de 2021 Departamento de Ciencias de la Computación FAST-NU, Lahore, Pakistán Índice 1 Objetivo 2 2 Distribución de tareas 2 3 HTML 3 1.1. ¿Qué es HTML? 3 1.2. Etiquetas HTML 3 1.3. Navegadores web 3 1.4. ELEMENTOS HTML 4 1.5. Encabezados HTML 4 4 Creación de formularios web ASP.Net usando Visual Studio 4 4.1 CONTROLES ASP (Comportamiento similar a los elementos HTML) 8 4.2 Puntos clave 10 5 Ejercicio 13 ⦁ Objetivo El propósito de este documento es brindar una implementación práctica de HTML, toda la descripción general de etiquetas y elementos HTML, con ejemplo e implementación en vivo durante el laboratorio. Introducción a ASP.NET, este documento responderá cómo crear un nuevo proyecto. ¿Cómo crear una nueva página web? Y practique en varios controles asp. ⦁ Distribución de tareas Tiempo total 90 minutos Introducción 10 minutos Elementos HTML 15 minutos Control ASP 15 minutos Ejercicio 45 minutos ⦁ HTML ⦁ ¿Qué es HTML? HTML es un lenguaje para describir páginas web. ⦁ HTML significa lenguaje de marcado de hipertexto ⦁ HTML no es un lenguaje de programación, es un lenguaje de marcado ⦁ El propósito de las etiquetas es describir el contenido de la página ⦁ Etiquetas HTML Las etiquetas de marcado HTML generalmente se denominan etiquetas HTML ⦁ Las etiquetas HTML son palabras clave (etiqueta nombres) rodeadas por corchetes angulares como ⦁ Las etiquetas HTML normalmente vienen en pares como y ⦁ La etiqueta final se escribe como la etiqueta inicial, con una barra diagonal antes del nombre de la etiqueta ⦁ Las etiquetas de inicio y fin también se denominan etiquetas de apertura y etiquetas de cierre. ⦁ Navegadores web El propósito de un navegador web (Chrome, Internet Explorer y Firefox) es leer documentos HTML y mostrarlos como páginas web. El navegador no muestra las etiquetas HTML, pero las utiliza para interpretar el contenido de la página: ⦁ ELEMENTOS HTML ⦁ Un elemento HTML comienza con una etiqueta de inicio/etiqueta de apertura ⦁ Un elemento HTML termina con una etiqueta de cierre/etiqueta de cierre ⦁ El el contenido del elemento es todo lo que se encuentra entre la etiqueta inicial y final ⦁ Algunos elementos HTML tienen contenido vacío ⦁ La mayoría de los elementos HTML pueden tener atributos ⦁ Encabezados HTML
Mira esto
¿Qué piensas de ello ahora?
¿Y qué pasa ahora?
⦁ Creación de un formulario web ASP.Net usando Visual Studio Paso 1: Inicie una instancia de Visual Studio (versión: 20XY) y cree un nuevo proyecto yendo a Archivo –> Nuevo—> Proyecto –> Web –> Aplicación web ASP.NET como se muestra a continuación: Paso 2: Navegue hasta el Explorador de soluciones y agregue un nuevo formulario web. Paso 3: elija el formulario web de la plantilla disponible y establezca su nombre. Paso 4: haga doble clic en MyPage.aspx en el explorador de soluciones y haga clic en el espacio vacío en el mypage.aspx y presione “CTRL+F5” La salida sería así: ⦁ CONTROLES ASP (Comportamiento similar a los elementos HTML) Un TextBox básico: <asp:TextBox ID="txtName" runat="server"></asp:TextBox > Un TextBox de contraseña: <asp:TextBox ID="txtPassword" TextMode="password" runat="server"></asp:TextBox> Un TextBox con texto: <asp:TextBox ID="txtTextValue" Text="¡Hola mundo!" runat="server"></asp:TextBox> Un cuadro de texto multilínea: <asp:TextBox ID="txtComment" TextMode="multiline" runat="server"></asp:TextBox> Casilla de verificación <asp:CheckBox ID=" chkIsStudent" runat="servidor" /> Botón de opción <asp:RadioButton ID="rdMale" GroupName="Género" runat="servidor" /> <asp:RadioButton ID="rdFemale" GroupName="Gender" runat="server" /> Lista desplegable <asp:DropDownList ID="ddlDepartment" runat="server"> <asp:ListItem Text="Select" Value=" 0"></asp:ListItem> <asp:ListItem Text="Informática" Value="CS"></asp:ListItem> <asp:ListItem Text="Ingeniería eléctrica" Value="EE"></asp:ListItem> <asp:ListItem Text="Administrador de Empresas" Value="BBA"></asp:ListItem> <asp:ListItem Text="Ingeniería Civil" Value="CV"> </asp:ListItem> </asp:DropDownList> Botón <asp:Button ID="btnSave" Text="Guardar formulario" runat="server" /> Imagen <asp:Image ID="Image2" ImageUrl="https://auth.gfx.ms/images/ms-logo.png" runat="server" /> ⦁ Puntos clave ⦁ Pregunta: ¿Por qué tengo que especificar runat="server" en todas mis ASP? NET controla cuándo es un atributo obligatorio y el servidor es la única opción disponible en mi conocimiento limitado de ASP.NET, ¿y aparece un error si no lo uso? ⦁ Respuesta: tiene que ver con cómo se identifican los controles del lado del servidor durante el procesamiento. En lugar de tener que verificar cada control en tiempo de ejecución por nombre para determinar si es necesario realizar el procesamiento del lado del servidor, realiza una selección en la representación del nodo interno por etiqueta. El compilador verifica que todos los controles que requieren etiquetas de servidor las tengan durante el paso de validación. ⦁
significa nueva línea en HTML ⦁ significa espacio en HTML FORMULARIO DE MUESTRA ⦁ Ejercicio Usando el formulario web ASP cree una página de muestra como se muestra a continuación. Nota: logotipo de Instagram: puede utilizar cualquier logotipo de Internet.
