Boolean Education_Yan Shiba_HTML didacticiel de ressources vidéo

"Boolean Education_Yan Shiba_HTML Tutorial" part des concepts les plus élémentaires et approfondit étape par étape, amenant chacun à apprendre les connaissances de base des styles HTML et CSS, et à comprendre la signification et l'utilisation de base de diverses balises couramment utilisées. La moitié du didacticiel explique comment ajouter du code de style CSS, jetant ainsi les bases des cours de cas ultérieurs.

Adresse de lecture du cours : http://www.php.cn/course/222.html

Le style d'enseignement de l'enseignant :

Les cours de l'enseignant sont simples et approfondis, de structure claire, analysés couche par couche, imbriqués, rigoureux dans l'argumentation, rigoureux dans la structure et l'utilisation le pouvoir logique de la pensée pour attirer l'attention des élèves. Force, utiliser la raison pour contrôler le processus d'enseignement en classe. En écoutant les cours de l'enseignant, les étudiants acquièrent non seulement des connaissances, mais reçoivent également une formation à la réflexion, et sont également influencés et influencés par l'attitude académique rigoureuse de l'enseignant

Le point le plus difficile dans ce domaine la vidéo est un traitement de débordement par débordement ：

Question soulevée :
Le cas le plus simple est que nous incluons un petit élément p de largeur fixe (comme la navigation, la référence, etc.) avec un autre élément sommaire Dans un grand p. Par exemple, le code suivant :

<p id="outer">     
  <p id="inner"> <h2>A Column</h2> </p>     
  <h1>Main Content</h1>     
  <p>Lorem ipsum</p>     
</p>

Nous pouvons définir une valeur de largeur (par exemple, 20%) pour "#inner", mais comme p est un élément de niveau bloc, même si nous définissons la largeur, le contenu derrière ne peut être affiché que dans la ligne suivante, à moins que nous lui définissions un attribut flottant (qu'il soit flottant à gauche ou flottant à droite). Le problème que nous avons mentionné ci-dessus se posera alors à ce moment-là.

Ce ne sera pas un problème si "#inner" a une largeur et une hauteur plus petites que "#outer".

Cependant, si la hauteur de "#inner" dépasse la hauteur de "#outer", alors le bas de "#outer" dépassera le bas de "#outer". En effet, après avoir défini l'attribut float pour "#inner", il se détachera du flux de texte et, quelle que soit la façon dont sa largeur et sa hauteur changent, "#outer" ne suivra pas les changements.

Exemple 1 : performances de mise en page lorsque les flottants ne sont pas effacés
Dans cet exemple, il n'y aura aucun problème au début car la hauteur de "#inner" est plus petite que "#outer", mais lorsque vous cliquez "Extend" "Après cela, vous constaterez que le bord inférieur de "#inner" a dépassé la plage de "#outer", mais "#outer" n'a pas changé. Il s'agit du problème du "clear float (closed float element)" ou "closed float" que nous avons mentionné

Solution :
1) Méthode de balise supplémentaire
La première est également recommandée par le W3C La meilleure façon consiste à utiliser des balises supplémentaires. Cette méthode consiste à ajouter une balise vide à la fin du contenu. La méthode typique consiste à utiliser quelque chose comme

<br style="clear:both;" />

ou à utiliser

<p style="clear:both;"></p>

. pass L'ajout d'un élément HTML force le conteneur externe à se développer. Cependant, cette méthode ajoutera des balises supplémentaires et rendra la structure HTML moins concise.

Ici, nous vous recommandons également de télécharger du matériel : http://www.php.cn/xiazai/learn/1857

1. lionhit

2. minilionhit

3. xhtml

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!