Création d'une page de base sur le framework ASP.Net avec CSS
Manuel de laboratoire de l'Université nationale d'informatique et des sciences émergentes 1.1 « Introduction à ASP.net, HTML » Laboratoire de systèmes de bases de données Printemps 2021 Département d'informatique FAST-NU, Lahore, Pakistan Table des matières 1 Objectif 2 2 Répartition des tâches 2 3 HTML 3 1.1. Qu’est-ce que le HTML ? 3 1.2. Balises HTML 3 1.3. Navigateurs Web 3 1.4. ÉLÉMENTS HTML 4 1.5. Rubriques HTML 4 4 Création d'un formulaire Web ASP.Net à l'aide de Visual Studio 4 4.1 CONTRÔLES ASP (Comportement similaire aux éléments HTML) 8 4.2 Points clés 10 5 Exercice 13 ⦁ Objectif Le but de ce document est de donner une implémentation pratique du HTML, la vue d'ensemble de balises et d'éléments HTML, avec exemple et implémentation en direct pendant le laboratoire. Introduction à ASP.NET, ce document répondra comment créer un nouveau projet ? Comment créer une nouvelle page Web ? Et entraînez-vous sur divers contrôles asp. ⦁ Répartition des tâches Durée totale 90 minutes Introduction 10 minutes Éléments HTML 15 minutes Contrôle ASP 15 minutes Exercice 45 minutes ⦁ HTML ⦁ Qu'est-ce que le HTML ? HTML est un langage permettant de décrire des pages Web. ⦁ HTML signifie Hyper Text Markup Language ⦁ HTML n'est pas un langage de programmation, c'est un langage de balisage ⦁ Le but des balises est de décrire le contenu de la page ⦁ Balises HTML Les balises de balisage HTML sont généralement appelées balises HTML ⦁ Les balises HTML sont des mots-clés (tag noms) entourés de crochets comme ⦁ Les balises HTML viennent normalement par paires comme et ⦁ La balise de fin s'écrit comme la balise de début, avec une barre oblique avant le nom de la balise ⦁ Les balises de début et de fin sont également appelées balises d'ouverture et balises de fermeture ⦁ Navigateurs Web Le but d'un navigateur Web (Chrome, Internet Explorer et Firefox) est de lire des documents HTML et de les afficher sous forme de pages Web. Le navigateur n'affiche pas les balises HTML, mais utilise les balises pour interpréter le contenu de la page : ⦁ LES ÉLÉMENTS HTML ⦁ Un élément HTML commence par une balise de début/balise d'ouverture ⦁ Un élément HTML se termine par une balise de fin/balise de fermeture ⦁ Le le contenu de l'élément est tout ce qui se trouve entre la balise de début et la balise de fin ⦁ Certains éléments HTML ont un contenu vide ⦁ La plupart des éléments HTML peuvent avoir des attributs ⦁ Titres HTML
Regarde ça
Qu'en penses-tu maintenant
Et maintenant
⦁ Création d'un formulaire Web ASP.Net à l'aide de Visual Studio Étape 1 : démarrez une instance de Visual Studio (version : 20XY) et créez un nouveau projet en accédant à Fichier -> Nouveau -> Projet -> Web -> Application Web ASP.NET comme illustré ci-dessous : Étape 2 : Accédez à l'Explorateur de solutions et ajoutez un nouveau formulaire Web Étape 3 : Choisissez le formulaire Web dans le modèle disponible et définissez son nom Étape 4 : Double-cliquez sur MyPage.aspx dans l'explorateur de solutions et cliquez sur un espace vide dans le mypage.aspx et appuyez sur « CTRL+F5 ». Le résultat serait comme ceci : ⦁ CONTRÔLES ASP (comportement similaire aux éléments HTML) Une TextBox de base : <asp:TextBox ID="txtName" runat="server"></asp:TextBox > Un TextBox de mot de passe : <asp:TextBox ID="txtPassword" TextMode="password" runat="server"></asp:TextBox> Un TextBox avec du texte : <asp:TextBox ID="txtTextValue" Text="Bonjour tout le monde !" runat="server"></asp:TextBox> Une TextBox multiligne : <asp:TextBox ID="txtComment" TextMode="multiline" runat="server"></asp:TextBox> Case à cocher <asp:CheckBox ID=" chkIsStudent" runat="server" /> Bouton radio <asp:RadioButton ID="rdMale" GroupName="Gender" runat="server" /> <asp:RadioButton ID="rdFemale" GroupName="Gender" runat="server" /> Liste déroulante <asp:DropDownList ID="ddlDepartment" runat="server"> <asp:ListItem Text="Select" Value="0">< /asp:ListItem> <asp:ListItem Text="Informatique" Value="CS"></asp:ListItem> <asp:ListItem Text="Génie électrique" Value="EE"></asp:ListItem> <asp:ListItem Text="Business Administrator" Value="BBA"></asp:ListItem> <asp:ListItem Text="Génie civil" Value="CV"> </asp:ListItem> </asp:DropDownList> Bouton <asp:Button ID="btnSave" Text="Enregistrer le formulaire" runat="server" /> Image <asp:Image ID="Image2" ImageUrl="https://auth.gfx.ms/images/ms-logo.png" runat="server" /> ⦁ Points clés ⦁ Question : Pourquoi dois-je spécifier runat="server" sur tous mes contrôles ASP.NET lorsqu'il s'agit d'un attribut obligatoire et que le serveur est la seule option disponible dans ma connaissance limitée d'ASP.NET, et j'obtiens une erreur si je ne l'utilise pas ? ⦁ Réponse : cela concerne la manière dont les contrôles côté serveur sont identifiés lors du traitement. Plutôt que d'avoir à vérifier chaque contrôle au moment de l'exécution par son nom pour déterminer si un traitement côté serveur doit être effectué, il effectue une sélection sur la représentation du nœud interne par balise. Le compilateur vérifie que tous les contrôles qui nécessitent des balises de serveur en disposent lors de l'étape de validation. ⦁
signifie une nouvelle ligne en HTML ⦁ signifie un espace en HTML EXEMPLE DE FORMULAIRE ⦁ Exercice Utilisation du formulaire Web ASP, créez un exemple de page comme indiqué ci-dessous. Remarque : logo instagram : Vous pouvez utiliser n'importe quel logo provenant d'Internet.