Maison >interface Web >tutoriel CSS >Clear (attribut HTML)

Clear (attribut HTML)

Jennifer Aniston
Jennifer Anistonoriginal
2025-02-27 08:38:09255parcourir

L'attribut clear: une méthode obsolète pour contrôler l'écoulement des éléments. Cet attribut HTML, maintenant considéré comme obsolète, a été utilisé pour empêcher le contenu de s'enrouler des éléments flottants (comme des images ou des tables). Au lieu d'utiliser clear, le développement Web moderne repose sur CSS pour le contrôle de la disposition.

La fonctionnalité de l'attribut clear est reproduite à l'aide de la propriété CSS clear. Voici une comparaison:

html déprécié:

<code class="language-html"><br clear="left"></code>

CSS moderne:

<code class="language-html"><br style="clear: left;"></code>

(Remarque: CSS en ligne, comme indiqué ci-dessus, est généralement découragé. Il est de la meilleure pratique de définir des styles dans un fichier CSS séparé ou dans les balises <style></style> dans le .)

Exemple: Empêcher le texte de s'enrouler autour d'une image alignée à droite.

<code class="language-html"><p><img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/174061669131942.jpg" class="lazy" alt="clear (HTML attribute) ">
The rest of the day was a lazy one, partly spent by the complex pool, partly inside watching British TV, but we couldn't be doing this for the rest of the holiday. Already we were missing having the car!
<br style="clear: both;">
I decided to check out what the weather would be doing for the next few days, as that would help us make any decisions about future excursions.
</p></code>

Questions fréquemment posées (FAQ)

  • Objectif de l'attribut clear: L'attribut clear contrôle le flux des éléments, en particulier autour des éléments flottants. Il spécifie quels côtés (gauche, droite, les deux ou non) des éléments flottants sont empêchés de s'enrouler.

  • Différence entre clear et css float: float positionne un élément à gauche ou à droite, permettant à d'autres contenus de circuler autour de lui. clear empêche ce comportement d'emballage.

  • clear avec des éléments non trumés: clear affecte uniquement les éléments flottants. Utilisez d'autres propriétés CSS (comme position, display, ou flex) pour les éléments non polis.

  • clear: both: Cela empêche les éléments flottants d'apparaître de chaque côté de l'élément.

  • clear L'impact de la disposition: clear affecte de manière significative la mise en page en contrôlant le positionnement des éléments par rapport aux éléments flottants. Il crée des dispositions plus propres et plus organisées.

  • Prise en charge du navigateur: clear est largement pris en charge dans les navigateurs modernes, mais les tests à travers les navigateurs sont toujours recommandés.

  • clear avec des éléments en ligne: Bien que techniquement possible, il est moins efficace avec les éléments en ligne en raison de leur comportement inhérent.

  • Conséquences de l'omission de clear avec des éléments flottés: omet clear peut entraîner des éléments qui se chevauchent ou mal alignés.

  • clear Dans la conception réactive: clear est utile dans la conception réactive pour maintenir des dispositions cohérentes sur différentes tailles d'écran.

  • Problèmes courants: Le comportement de compensation inattendu peut se produire avec des éléments imbriqués ou des dispositions complexes. N'oubliez pas que clear ne fonctionne qu'avec des éléments flottants, pas des éléments absolument positionnés ou flexibles.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn