Comment créer une chronologie html interactive

<

Contenu

  • Conseils & avertissements
    • article data-type="article">
    Faire une ligne de temps interactive HTML prend peu de temps.

    Une ligne de temps est un moyen utile pour afficher une liste d`événements sur une page Web, et une ligne de temps interactive donne aux utilisateurs un certain contrôle sur le contenu de visualisation. Alors que de nombreux moyens existent pour créer une ligne de temps interactive, la plupart exigent plus que le langage de balisage hypertexte juste (HTML). Cependant, il y a une solution HTML très simple. Vous pouvez facilement créer des barres de défilement interactives pour votre ligne de temps en utilisant HTML de "style" attribut. En faisant cela, les utilisateurs de votre temps ligne seront en mesure de faire défiler son contenu comme ils aiment.

    Choses que vous devez

    • logiciel éditeur de texte

    • Créez votre fichier HTML. Ouvrez un nouveau document dans un programme de logiciel d`éditeur de texte et créer une page HTML de base. Ajoutez ce code dans le code HTML "corps" section:




      L`élément de division ("div") Est un conteneur pour la liste de votre temps en ligne des événements. le "débordement" valeur de "auto" ajoute une barre de défilement interactif lorsque votre ligne de temps devient plus large ou plus élevé que ce conteneur. Enregistrez la page sous "timeline.html".

    • Créer votre propre contenu en ligne de temps. Dans l`espace entre l`ouverture et la fermeture "div" balises, ajouter les événements de votre temps ligne par ordre croissant ou décroissant. Ajouter chaque événement dans sa propre section du HTML bien formé. Continuez à enregistrer la page que vous travaillez.

    • Testez votre code HTML. Ouvrez le navigateur et la charge Web de votre ordinateur "timeline.html." Si sa teneur est supérieure à la "div" conteneur, vous verrez une barre de défilement interactive. Ajuste le "largeur" et "la taille" les valeurs du conteneur en fonction de votre mise en page verticale ou horizontale.

    Conseils & Avertissements

    • dispositions verticales sont les plus faciles à code. Enroulez simplement chacun de vos sections d`événements au sein de sa propre "div" élément. Pour une disposition horizontale, vous pouvez utiliser une table avec une seule rangée et une cellule de colonne pour chaque événement. Si vous faites cela, assurez la hauteur de votre table le même que votre "div" la hauteur du récipient. Prenez soin de votre table de vertical "marge" et "rembourrage" valeurs.
    • Cet article crée une scrollbar interactive en utilisant un "en ligne" feuille de style en cascade (CSS). "En ligne" feuilles de style vont à l`intérieur du "style" attribut de la balise d`ouverture d`un élément HTML. Vous pouvez utiliser un "interne" ou "externe" feuille de style à la place, cependant. "Interne" feuilles de style vont à l`intérieur du HTML "tête" section. "Externe" feuilles de style sont séparés "Css" fichiers. En utilisant l`un de ces types vous donne plus de contrôle sur la mise en forme de tout contenu HTML.
    • Vous pouvez étendre l`interactivité de l`exemple en utilisant javascript. Vous pourriez commencer par l`ajout de boutons HTML, puis écrire un javascript afin de déplacer le contenu de votre ligne de temps lorsque les utilisateurs cliquent sur les boutons.
    Technologie / Web design & développement / Création de sites web

    AUTRES

    Comment faire un blog en html фото

    Comment faire un blog en html

    Création d`un blog en HTML est un moyen simple d`avoir un blog, vous pouvez mettre à jour dans un éditeur de texte.…

    » » » » Comment créer une chronologie html interactive