Éditeur HTML/CSS ? (5 / 8 étapes)

Étape 5: Tags

Regardons ces balises :

< div id = « page » >
< div id = « content » >

J’ai tout d’abord mis en place deux divisions, la première appelée « page » et le second un « contenu ».

La division « page » peut être considérée comme une boîte, ou même une page de la brochure (par conséquent, la page « nom »). J’ai plus tard spécifie la taille et le type de division que sera ma « page ».

Immédiatement après avoir configuré ma « page », j’ai créé une autre division, « contenue ». Pensez à cela comme une boîte plus petite imbriquée à l’intérieur de plus, « page ». Ou bien, pensez à « contenu » comme une petite note collé sur ma plus grande page de mon livret. En réalité, une division n’est pas nécessairement plus grande ou plus petite que l’autre. La taille d’une division est entièrement dépendante de comment les définir.

Une autre façon de penser des deux divisions serait d’imaginer une page d’album photo (le "site"), avec une photo (le « contenu ») collée sur la page. Je peux spécifier plus tard la taille exacte de la page de l’album ainsi que la taille exacte de la photo.

Après la mise en place de la division « contenu », je rentre les informations et les images que je veux être sur cette petite note.

< h2 > est une balise qui identifie mon titre, « Liste de vérification quotidienne ». Sur d’autres pages, j’ai utilisé < h1 >, que je peux définir comme un grand titre. Pour < h2 > j’ai spécifier plus tard une légèrement plus petite taille de la police, de la sorte d’une sous-rubrique.

< ul >
représente une liste non ordonnée, simplement une liste de bullet points plutôt qu’une liste ordonnée, ce qui serait une liste numérotée, ou une liste de plan à l’aide de lettres.

La plupart des navigateurs internet normalement affichent < ul > listes avec un tiret. Cependant, j’ai choisi de le définir comme n’ayant aucun point de la balle.

C’est mon document et je vais pleurer si je veux... Je veux dire, je vais énumérer sans balles si je veux.

Chaque élément dans ma liste est étiqueté < li > au début et < /li > à la fin. À la fin de la liste entière est une balise de fermeture, < /ul >.

< classe p = « footer » > 1 < /p >

Normalement, un simple paragraphe en HTML est le tag < p > au début et < /p > à la fin. Dans mon cas, j’ai voulu le paragraphe pour afficher les numéros de page en gris. J’ai utilisé ma feuille de style pour définir une classe spéciale du paragraphe que j’ai appelé « footer ».

< div class = « saut de page » >< / div >
Cette balise division aura une classe spéciale définie par la suite, appelé « saut de page ». La division n’aura aucun texte ou les images à afficher, alors j’ai suivi immédiatement la balise avec une balise de fermeture, < / div >. Le but de la division « saut de page » sera pour signaler la fin d’une page et le début d’une autre. Dans mon extrait, j’ai mis le saut de page immédiatement après l’étape un. Dans mon document d’origine, la version intégrale, j’ai mis le saut de page après chaque huit pages jusqu'à ce que j’ai atteint la fin. Je voulais finir par impression de huit pages de petit livret sur un seul morceau de papier, 8,5 x 11 pouces. Avec ma division de saut de page, je pourrais signaler le navigateur internet pour imprimer le livret 8 pages sur une seule page.

Les balises restantes ferment tags, indiquant la fin des deux divisions, la fin du corps et la fin du document.

Articles Liés

Créer un site Web tout sur vous avec Visual Studio (HTML, CSS, JQUERY)

Créer un site Web tout sur vous avec Visual Studio (HTML, CSS, JQUERY)

Hey tout le monde !Il s'agit de mon premier instructable et dans ce instructable je vais vous montrer comment utiliser Visual Studio pour créer votre propre site Web !Voici un lien de téléchargement pour Visual Studio :Liaison d'origine Visual Studio
Galerie d’images simple HTML CSS Javascript

Galerie d’images simple HTML CSS Javascript

Dans le premier épisode de cette série, j'ai tenir une conversation avec un DIYer Dale nommé et transformez-le en un didacticiel vidéo relatif à une éventuelle solution. À partir de zéro, nous allons construire une fonction javascript simple qui va d
Comment améliorer votre Instructables aide HTML

Comment améliorer votre Instructables aide HTML

Instructables sont un moyen génial de partager vos connaissances et apprendre des autres. Parfois, une grande quantité de texte dans un Instructablecan être intimidant ou une Instructable juste ne semble pas très intéressant. Pour résoudre ce problèm
Faire un site Web html facile

Faire un site Web html facile

tout ce dont vous avez besoin pour cela est un ordinateur, des connaissances en html/css et un certain temps.Étape 1. Téléchargez le fichier zip et l'extraire. Ouvrez les fichiers dans un éditeur de texte comme le bloc-notes ou notepad ++Étape 2. Tou
Comment faire un site en HTML

Comment faire un site en HTML

si vous jamais voulu faire un site Web, mais ne savais pas comment, c'est une bonne façon de le faire !Étape 1: Les bases Pour faire quelque chose en HTML, vous devez commencer avec la balise <HTML> Ensuite, vous devez ajouter votre en-tête. <HEA
Faites votre HTML-site Web adapté aux appareils mobiles

Faites votre HTML-site Web adapté aux appareils mobiles

tout d'abord, je n'étais pas satisfait lorsque j'ai visité un site optimisé Bureau sur un smartphone.Les polices sont trop petites, vous avez de panoramique et de zoomez / tout le temps, les liens sont toujours difficiles à cibler. Donc j'ai dû faire
Le Guide complet de débutants en HTML

Le Guide complet de débutants en HTML

ce tutoriel est écrit à partir du sol pour débutants complets au monde de la programmation. Évidemment si vous êtes familiarisé avec certains langages de programmation, ce sera un peu plus facile.Si vous êtes nouveau à la programmation ne vous décour
Comment démarrer votre HTML Document droit

Comment démarrer votre HTML Document droit

si vous êtes juste de se lancer dans le domaine de la programmation web, vous avez probablement entendu parler du HTML, ou Hyper Text Markup Language. C'est le langage de balisage de base pour la création de pages web statiques. Mais pour créer un do
Déplacer des éléments HTML avec JQuery via Serial

Déplacer des éléments HTML avec JQuery via Serial

Cette instructable agit en utilisant les valeurs reçues de l'Arduino et à les utiliser pour manipuler des éléments HTML à l'intérieur de Involt. Cependant cela n'utilisera pas les méthodes Involt JQuery ou éléments d'interface utilisateur, mais cet e
Curseur de HTML RVB pour Arduino via Serial

Curseur de HTML RVB pour Arduino via Serial

Bonjour à nouveau !J'ai décidé d'écrire plus de tutoriels sur mon HTML/CSS & Arduino projet nommé Involt. Pour plus de détails qu'est-ce vérifier le site Web du projet.Dans ce instructable je vais montrer til plus facile et rare moyen de contrôle LED
Communication série entre Arduino, HTML & Chrome

Communication série entre Arduino, HTML & Chrome

Il est facile de travailler avec Arduino, mais la création de projet qui comprend le logiciel nécessite plus de compétences en programmation. Contrairement à d'autres solutions, mon projet est le moyen pour créer HTML hors connexion app - sans choses
Faites vos propres sites Web - HTML de base (partie 1)

Faites vos propres sites Web - HTML de base (partie 1)

il s'agit d'un guide multi-partie sur comment construire vos propres sites Web. Je vais aborder tout de code HTML de base, le code PHP plus avancés, aux éditeurs de GUI pour rendre vos processus plus rapide. Cette première partie portera sur l'utilis
Serveur Web Python pour votre Raspberry Pi

Serveur Web Python pour votre Raspberry Pi

Remarque : Si vous voulez seulement un serveur web qui ne nécessite pas de Python, consultez ce tutoriel, que j'ai fait pour un serveur web super facile pour le Raspberry Pi.Vous savez certains Python de base ou vous voulez en apprendre un peu et vou
Interface web simple et intuitive pour votre Raspberry Pi

Interface web simple et intuitive pour votre Raspberry Pi

Le Raspberry Pi est un mini-ordinateur incroyable de 35 dollars. Il vous permet de faire tout ce que vous pourriez faire avec un ordinateur Linux (connexion à l'internet, regarder des vidéos, de lancer des applications,...) mais aussi d'interagir ave