Les partenaires publicitaires:

Comment faire pour créer une barre de défilement tableau en CSS

En utilisant le "overflow: auto" propriété-valeur paire dans Cascading Style Sheet (CSS) Code donne une barre de défilement pour un élément HTML lorsque son contenu vont sur une largeur ou hauteur maximale. Sachant cela, vous pouvez faire défiler un tableau en l'enveloppant dans un élément contenant, comme un DIV. Depuis la barre de défilement prendra un peu de place à l'intérieur de la DIV et de provoquer une seconde barre de défilement, vous devez ajouter un peu d'espace pour elle dans votre code. Vous pouvez appliquer cette astuce sur les tables pour créer soit une barre de défilement vertical ou horizontal.

Instructions

  1. 1

    Ouvrez votre page Web qui contient la table dans le Bloc-notes ou un éditeur de code. Trouver l'ouverture "

    " marquer et ajouter une ouverture "

    " tag. Donnez le "
    " marquer un nom d'identification:

  2. 2

    Localisez la clôture "" marquer et ajouter une fermeture "

    " tag sur la ligne suivante:




  3. 3

    Aller en haut de votre code et regarder entre les "" tags pour "

  4. 4

    Définir une largeur de la table si vous ne le faites pas: table {width: 300px-}. Ce code trouve une table sur la page Web et il donne une largeur de 300 pixels.

  5. 5

    Définissez la largeur de votre DIV à une valeur de 18 pixels plus larges que votre table, pour accueillir la barre de défilement: div {width: 318px-}.

  6. 6

    Donnez votre div une hauteur et régler la "débordement" immeuble à "auto": Div {largeur: hauteur 318px-: débordement 200px-: automatique}. Lorsque la hauteur de la table dépasse la hauteur de la DIV, alors la il affichera une barre de défilement vertical.

Conseils & Avertissements

  • Pour obtenir une barre de défilement horizontale, régler la largeur de la DIV à une valeur que vous souhaitez utiliser comme la largeur maximale de la table à la place. La "débordement" propriété va ajouter une barre de défilement horizontale lorsque la table est supérieure à la largeur de la DIV.
  • Sauvegardez fichiers de pages Web avant de tenter de les modifier.
» » » » Comment faire pour créer une barre de défilement tableau en CSS