Solution au problème selon lequel l'attribut width des éléments HTML n'a aucun effet

1. L'attribut width de l'élément n'a aucun effet. Exécutons d'abord le programme et voyons : [html] 123 Vous pouvez voir que le span changera automatiquement la largeur en fonction du contenu qu'il contient. En effet : pour les éléments en ligne (il peut être en ligne par défaut, comme les éléments span, ou il peut être 1. Concernant l'attribut width de l'élément n'ayant aucun effet
Exécutez d'abord le programme pour voir :

Astuces : Vous pouvez d'abord modifier une partie du code puis exécuter

Vous pouvez voir que le span changera automatiquement la largeur en fonction du contenu qu'il contient
En effet : pour les éléments en ligne ( il peut être en ligne par défaut) Par exemple, les éléments span peuvent également être display : éléments en ligne)
la largeur et la hauteur déclenchent uniquement hasLayout sous IE5.x et IE6 ou les versions ultérieures du mode quirks. Pour IE6, si le navigateur s'exécute en mode de compatibilité standard, les éléments en ligne ignoreront les attributs width ou height, donc la définition de width ou height ne peut pas ordonner à l'élément d'avoir une disposition dans ce cas.
Si un élément avec "layout" affiche également : inline, son comportement est très similaire au inline-block mentionné dans la norme : il est disposé horizontalement et continuellement dans le paragraphe comme un texte ordinaire, sous réserve de vertical- align affecte et la taille peut être ajustée de manière adaptative en fonction du contenu. Cela peut également expliquer pourquoi dans IE/Win seul, les éléments en ligne peuvent contenir des éléments de niveau bloc avec moins de problèmes, car dans d'autres navigateurs, display: inline signifie en ligne, contrairement à IE/Win, une fois que l'élément en ligne a une mise en page, il a toujours une mise en page. Deviendra un bloc en ligne.
Solution :
<1>Supprimer la déclaration standard du W3C de la page ASP.NET (non recommandé) :

123
<2> Recommandé :
Si display:block est défini, l'attribut width prend effet, mais la durée est la même que p à cette fois.
Si display:inline-block est défini, les étendues seront répertoriées dans la même ligne et l'attribut width prendra effet.

Descriptions des valeurs communes pour l'attribut d'affichage de l'élément :
bloc : valeur par défaut de l'objet bloc. Force l'objet à être rendu sous forme d'objet bloc, en ajoutant une nouvelle ligne après l'objet.
inline : valeur par défaut pour les objets en ligne. Force le rendu de l'objet en tant qu'objet en ligne, supprimant ainsi les lignes de l'objet. (En ligne) Affichage du texte chinois « Le guide définitif du CSS » : tout élément visible qui n'est pas un élément de niveau bloc est un élément en ligne. La caractéristique de ses performances est la forme de « disposition en lignes ». La « disposition en lignes » signifie ici que sa forme d'expression est toujours affichée en lignes. Par exemple, lorsque nous définissons un élément en ligne border-bottom:1px solid #000;, il sera répété dans chaque ligne et il y aura une fine ligne noire sous chaque ligne. S'il s'agit d'un élément de niveau bloc, la ligne noire affichée n'apparaîtra qu'en dessous du bloc.
inline-block : rend l'objet en tant qu'objet en ligne, mais restitue le contenu de l'objet en tant qu'objet bloc. Les objets en ligne adjacents seront rendus sur la même ligne.
non : objet caché. Contrairement à la valeur cachée de l'attribut visibilité, il ne réserve pas son espace physique à l'objet caché.
La largeur et la hauteur ne peuvent pas être définies pour les éléments inline (display:inline;) car inline appartient à la disposition en ligne et sa caractéristique doit être disposée sur une seule ligne, donc la largeur et la hauteur ne peuvent pas être définies.
123

<3> set :left | right, les attributs width prennent effet.
(flottant) Cela éloigne l'élément spécifié du flux de document ordinaire et produit des caractéristiques de mise en page extraordinaires. Et FLOAT doit être appliqué aux éléments de niveau bloc, ce qui signifie que le flottement ne s'applique pas aux balises en ligne. Ou en d’autres termes, lorsque FLOAT est appliqué, cet élément sera désigné comme élément de niveau bloc.
123
Affichage 2.Css : la différence entre l'attribut en ligne et le float
Display: inline; La fonction de l'attribut est de transformer les éléments de niveau bloc en éléments en ligne, tels que p. Après avoir défini l'attribut inline, il n'occupera plus une ligne séparée. Cependant, le même effet peut être obtenu en utilisant la page de propriétés float. (Pour plus d'informations sur les éléments en ligne et les éléments de niveau bloc, veuillez consulter Éléments en ligne et éléments de niveau bloc)
Lorsqu'un élément est défini sur l'attribut en ligne et devient un élément en ligne, la définition de l'attribut width n'a aucun effet.
Après avoir lu l'affichage : l'impact d'inline sur les éléments au niveau du bloc, jetons un coup d'œil à l'impact de float sur les éléments en ligne
C'est-à-dire que lorsqu'un élément en ligne définit l'attribut float, il pense en fait qu'il s'agit d'un bloc -level element , vous pouvez définir l'attribut width

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!