Contenu HTML des connaissances frontal

Tags : script caché post programmation langage ble trop elf introduction élément

HTML décrit la nature des services WEB

import socketsk = socket.socket()sk.bind(("127.0.0.1", 8080))sk.listen(5)while True:    conn, addr = sk.accept()    data = conn.recv(8096)    conn.send(b"HTTP/1.1 200 OK\r\n\r\n")    conn.send(b"<h1>Hello world!</h1>")    conn.close()

Demande de navigateur--> HTTP protocole--> serveur reçoit la demande--> retour serveur réponse--> serveur envoie le contenu des fichiers HTML au navigateur--> page du navigateur rendu

Ce qui est HTML ?

• Langage de balisage hypertexte (Hypertext Markup Language, HTML) est un langage de balisage utilisé pour créer des pages Web.
• Essentiellement une règle navigateur reconnaissable, nous écrivons des pages selon les règles, et le navigateur restitue nos pages selon les règles. Pour les différents navigateurs, il peut y avoir des interprétations différentes de la même étiquette. (Problèmes de compatibilité)
• Extension de fichier de la page Web :. html ou. htm

Ce qui n’est pas HTML ?

HTML est un markup Language (langage de balisage), qui n’est pas un langage de programmation.

HTML utilise des balises pour décrire des pages web.

Structure d’un Document HTML

La documentation HTML plus élémentaire :

≪ ! DOCTYPE html >< html lang = « zh-CN », < meta charset = « UTF-8", priorité de style css < titre > < / titre Le

1. ≪ ! DOCTYPE Html >, déclare comme un document HTML5.
2. La marque de début et fin du document est le signe de la marque début et de fin. Est l’élément racine de la page HTML, qu'entre lesquelles est l’en-tête du document (tête) et le corps.
3. La première partie du document HTML est définie dans le Le contenu entre eux n’est pas affiché dans la fenêtre de document. Contient des données meta (meta) pour le document.
4. Les points forts de la page sont définies dans la la barre de titre du navigateur.
5. Le texte entre les _ et les autres pages est visible vers le contenu principal de la page.

Attention :Pour des pages web chinois ont besoin d’utiliser≪ Meta charset = « utf-8 »Déclare le codage, dans le cas contraire, il apparaîtra brouillée. Certains navigateurs mis GBK comme codage par défaut, et vous avez besoin de le mettre à≪ Meta charset = « GBK ».

Étiquette HTML Format

• Balises HTML sont des mots clés, entourés par des accolades, comme < html >
• Balises HTML apparaissent habituellement dans les paires, tels que : < div > et < / div > la première étiquette est le commencement, et la seconde étiquette est la fin. L’étiquette de fin aura une barre oblique.
• Il y a aussi certaines balises qui sont présentées séparément, telles que : < br / >, < img src = « 1.jpg"/ > et ainsi de suite.
• Balises peuvent avoir plusieurs propriétés, ou ils peuvent être sans attributs.

Syntaxe pour les étiquettes :

• La 1 = « Valeur de la propriété 1 » propriété 2 = « valeur de la propriété 2"... La section "contenu" de la < / étiquette correspond au nom de la
• La 1 = « Valeur de la propriété 1 » propriété 2 = « valeur de la propriété 2"... / >

Quelques propriétés importantes :

• ID : L’ID unique, HTML document arbre qui définit une étiquette
• Classe : Définit un ou plusieurs noms de classe (nomclasse) pour les éléments HTML (nom de classe de style CSS)
• Style : Le style en ligne de l’élément spécifié (style CSS)

Commentaires HTML

< !--contenu d’annotations-->

Les commentaires sont la mère du code. -Extrait du devis Nezha

≪ ! DOCTYPE > tags

≪ ! Le DOCTYPE > déclaration doit être la première ligne du document HTML, avant l’étiquette de _ _.

≪ ! Le DOCTYPE > déclaration n’est pas une étiquette HTML ; c’est une instruction à un navigateur Web sur lequel HTML version la page utilise pour écrire.

Balises HTML communes des balises communes siège

Étiquette	Signification
Le	Définir un titre de la page
Le	Définir une feuille de style interne
Le	Définir le code JS ou d’introduire des fichiers JS externes
Le	Introduction d’un fichier de feuille de style externe
Le	Définir la page Web information originale

Balises META

Meta Tags Introduction :

• L’élément de Mata-informations fournit des informations originales sur la page, les descriptions et les mots-clés pour moteurs de recherche et les fréquences de mise à jour.
• L’étiquette de _ _ se trouve à la tête du document et ne contient-elle rien.
• Les informations fournies par les % ne sont pas visibles par l’utilisateur.

Composition des META Tags : balises meta ont un total de deux propriétés, elles sont des propriétés http-equiv et nom, différentes propriétés ont des valeurs de paramètre différentes, ces valeurs de paramètre différentes pour réaliser différents Web fonction.

propriété 1.http-equiv : l’équivalent de l’en-tête du fichier de HTTP, qui peut renvoyer des informations utiles au navigateur pour afficher correctement le contenu de la page Web, correspondant à la valeur de la propriété de contenu, contenu dans le contenu est en fait la valeur de la variable de chaque paramètre.

< !--2 secondes après avoir sauté à l’URL correspondante, faites attention à la marque de citation--> < meta http-equiv = « Refresh » content = « 2 ; URL = https://www.oldboyedu.com « !--le type de codage du document spécifié-->< meta http-equiv = » Content-type « Charset = UTF8 » !--Dire IE pour afficher le document en mode superlatif-->< meta http-equiv = « x-ua-compatible » content = « Ie = edge »

2. nommer les attributs : principalement utilisé pour décrire la page Web, la valeur de la propriété correspondante du contenu, contenu dans le contenu est principalement facile pour robot de moteur de recherche trouver les informations et les informations de classification.

≪ Nom meta = « keywords » content = « résumé de meta, HTML Meta, attributs meta, saut de meta » >< nom de meta = « description » content = " Old boy education College de Python »

Base label (étiquette de niveau bloc et inline) couramment utilisé dans le corps

% De plus brut
Les italiques dans
# Un soulignement de la
La suppression de la

L’étiquette de paragraphe # de la

Le titre de la 1 < / h1 >
Le titre de la 2 < / h2 >
Le titre des 3 < / h3 >
Le titre du 4 < / h4 >
Le titre de la 5 < / h5 >
Le titre des 6 < / h6 >

< !--line Wrapping-->
Le

< !--ligne horizontale--> < hr >

Caractères spéciaux

Contenu	Code correspondant
Espace	Le
Le	Le
Le	Le
Le	Le
￥	Le
Droit d’auteur	Le
Enregistré	Le

Étiquettes de DIV et span étiquettes

Balises div sont utilisés pour définir un élément de niveau bloc et n’ont aucune signification pratique. Il est principalement donné un spectacle différent par le biais de styles CSS.
Balises SPAN sont utilisés pour définir des éléments inline (en ligne) et n’ont aucune signification pratique. Il est principalement donné un spectacle différent par le biais de styles CSS.

La différence entre un élément de niveau bloc et un élément en ligne :
Un élément de bloc est un élément qui démarre rendu sur une autre ligne, et un élément en ligne ne nécessite pas une autre ligne. Si vous insérez ces deux éléments séparément dans une page Web, il n’y a pas d’effet sur la page.
Ces deux éléments sont spécialement conçus pour définir des styles CSS.

Attention :

Sur la nidification de l’étiquette : généralement des éléments de niveau bloc peuvent contenir des éléments inline ou certains éléments de niveau bloc, mais des éléments inline ne peut pas contenir d’éléments de niveau bloc, ils peuvent contenir les seuls autres éléments inline.

L’étiquette de P ne peut pas contenir des étiquettes de niveau bloc, ni pouvez l’étiquette P contient l’étiquette de P.

Balises IMG

≪ Img src = « Chemin de l’image » alt = « image ne charge pas lorsque l’invite « titre = « message d’invite souris suspension » width = « largeur » height = « haute (largeur deux propriétés seulement avec un correspondra automatiquement que zoom) »

Un tags

Balises de lien hypertexte

Un lien hypertexte est un lien qui pointe sur une page Web vers une cible, qui peut être une autre page, un emplacement différent sur la même page, une photo, une adresse électronique, un fichier ou même une demande.

URL

≪ a href = « http://www.oldboyedu.com » target = « _blank »

La propriété href spécifie l’adresse de la page destination. Il peut y avoir plusieurs types d’adresses :

• URL absolue-point vers un autre site (par exemple href = « http://www.jd.com)
• URL relative-renvoie le chemin d’accès exact dans le site actuel (href = « index.htm »)
• URL-point d’ancrage ancre dans la page (href = « #top »)

Objectif

• _Blank indique que la page de destination s’ouvre dans le nouvel onglet
• _Self indique que la page de destination s’ouvre dans l’onglet actif

Liste

1. non ordonnée liste

≪ Ul type = « disc », premier de ce qui suit

Propriété de type :

• Disque (rond plein, par défaut)
• Circle (cercle creux)
• Place (solide)
• Aucun (aucun style)

2. les listes

≪ Type ol = « 1 » start = « 2 », le premier élément de la

Propriété de type :

• Liste des numéros 1, valeur par défaut
• Une lettre majuscule
• Des lettres en minuscules
• Ⅰ Rome capitale
• Ⅰ Rome en minuscules

3. liste de titre

Le 1 < /dt > du 1 </DD > de ce qui suit est le titre de la JJ > contenu 2 </DD >< /dl >

Formulaire

Un tableau est un espace à deux dimensions données, une table constituée de plusieurs lignes et une ligne composée de plusieurs cellules qui peuvent contenir des listes, motifs, formes, symboles numériques, texte, texte prédéfini et autres tables.
Le but essentiel de la table est pour afficher les données de la classe table. Classe de la table les données font référence aux données qui convient le mieux adapté à une organisation pour le format tabulaire (c'est-à-dire par l’organisation de lignes et de colonnes).
Structure de base de la table :

Le nom du « no » Le < TD & G de la   T ; le Niang de la journée, le PT. Le

Propriété :

• : Frontière Table.
• Cellpadding : Marge intérieure
• CellSpacing : la distance extérieure.
• Largeur : pourcentage de pixels. (de préférence avec CSS pour définir la longueur et la largeur)
• RowSpan : Combien de lignes sont verticalement à travers les cellules
• Le nombre de colonnes colspan : Une cellule s’étend sur (autrement dit, une cellule fusionnée)

Formulaire

Fonction :

Les formulaires sont utilisés pour transférer les données vers le serveur, permettant aux utilisateurs d’interagir avec le serveur WEB

Le formulaire peut contenir les étiquettes de séries d’entrée, tels que les champs de texte, des cases à cocher, des boîtes de radio, avec plusieurs boutons valider et ainsi de suite.

Le formulaire peut également contenir des textarea, select, FieldSet et étiqueter les étiquettes.

Propriétés du formulaire

Propriété	Décrire
Accepter-charset	Spécifie le jeu de caractères utilisé dans le formulaire envoyé (par défaut : jeu de caractères de la page).
Action	Spécifiez l’emplacement de soumettre l’adresse du formulaire (URL) (page Submit).
Saisie semi-automatique	Spécifie que le navigateur doit remplir automatiquement la forme (défaut : sur).
Enctype	Spécifie le codage des données communiquées (par défaut : url-encodée).
Méthode	Spécifie la méthode HTTP à utiliser lors de l’envoi du formulaire (par défaut : obtenir).
Nom	Spécifie le nom de la fiche signalétique (pour utilisation de DOM : document.forms.name).
Novalidate	Spécifie que le navigateur ne valide pas la forme.
Objectif	Spécifie la cible de l’adresse de la propriété Action (par défaut : _self).

Éléments de formulaire

Concepts de base :
Formulaires HTML sont des éléments HTML, des pièces plus complexes, les formes sont souvent combinées avec des scripts, des pages dynamiques, informatique et autres fonctions, il est donc très important faire des sites Web dynamiques.
Formes sont généralement utilisés pour recueillir des informations d’entrée de l’utilisateur
Comment se forme travail :
Visiteurs peuvent remplir les informations requises lorsqu’ils parcourir une page Web avec une forme, puis appuyez sur un bouton de le soumettre. Ces informations sont transmises par Internet au serveur.
Ce données sont traitées par un programme dédié sur le serveur et si il y a une erreur, un message d’erreur est retourné et une erreur est nécessaire pour être corrigé. Lorsque les données sont complètes et correctes, le serveur nourrit retour une entrée pour compléter l’information.

Django.conf.urls importation urlfrom django.shortcuts importons HttpResponsedef Upload (demande) : Print (« Request. Get : «, demander. Get) print (« Request. MESSAGE : «, demander. » POST) si demande. Fichiers : nom = Request. [« Fichiers »] .name ouvert (filename, « WB ») sous la forme f : pour des morceaux dans la demande. Les fichiers [' fichier '] .chunks () : F.write (bloc) retourner HttpResponse retour HttpResponse (« téléchargé avec succès ») (« copier que ! » «) Urlpatterns = [url (r ' ^ upload /', télécharger),]

Entrée

L’élément de _ _ change à une variété de formes en fonction des propriétés de type différent.

Type valeur de la propriété	Formes d’Expression	Code correspondant
Texte	Texte d’entrée ligne unique	≪ Input Type = text « / >
mot de passe	Zone de saisie de mot de passe	≪ Input type = « Password » / >
Date	Zone de saisie de date	≪ Input type = « Date » / >
Case à cocher	Case à cocher	≪ Input type = « checkbox » cochée = « Checked » / >
Radio	Boîte de sélection unique	≪ Input type = « Radio » / >
Envoyer	Présenter le bouton	≪ Input type = « Submit » value = « soumis » / >
Remise à zéro	Bouton de réinitialisation	≪ Input type = « reset » valeur = « reset » / >
Bouton	Bouton normal	≪ Input type = « button » value = « boutons normales » / >
Caché	Masquer la zone de saisie	≪ Input type = « hidden » / >
Fichier	Zone de sélection de texte	≪ Input type = « File » / >

Description de la propriété :

• Nom : la « clé » lorsque le formulaire est envoyé, la différence entre la note et l’ID
• Valeur : valeurs pour les éléments correspondants au moment de la soumission du formulaire
  • Type = « button », « Reset », « envoyer » lorsque le texte est affiché sur le contenu de l’année de bouton
  • Type = « text », « Password », « caché » lorsque la valeur initiale de la zone de saisie
  • Type = « checkbox », « Radio », « Fichier », la valeur associée à l’entrée
• Vérifié : radio et case à cocher par défaut les éléments sélectionnés
• ReadOnly:Text et le mot de passe mis en lecture seule
• Handicapés : toutes les entrées sont applicables

Sélectionner des balises

≪ Action de formulaire = « méthode = « post », < select nom = » ville « id = « Ville », < option value = « 1 », Beijing ≪ Option sélectionnée = « Selected » Value = « 2 », Shanghai, < option value = « 3 », Guangzhou < option Valeur = « 4 », Shenzhen,

Description de la propriété :

• Multiple : Une propriété Boolean, la valeur des sélections multiples, sinon radio par défaut
• Handicapés : désactiver
• Sélectionnés : Cet élément est activé par défaut
• Valeur : Définit la valeur de l’option au moment de la présentation

Étiquette étiquettes

Définit l’étiquette a: < label > pour définir une légende (tag) pour un élément INPUT.
Remarque

1. L’élément label ne présente aucun trucage à l’utilisateur.
2. La valeur de propriété pour du _ _ label devrait être identique à la valeur de la propriété ID de l’élément associé.

≪ Forment l’action = « » < label for = « nom d’utilisateur » « Le » « » le « » la « » Nom d’utilisateur »

TextArea plusieurs lignes de texte

≪ Textarea nom = « Memo » id = cols « Memo » = « lignes = » [ »] » la valeur par défaut de la

Description de la propriété :

• Nom : titre
• Lignes : Nombre de lignes
• COLS : Nombre de colonnes
• Handicapés : désactiver

Contenu HTML des connaissances frontal