1. Utilisez la balise table et ses propres fonctions
<style> .parent{ bordure : 1px rouge uni ; hauteur : 500px } .child{ bordure : 1px noir uni } </style><body> <!-- --> <table class=parent> <tr> <td classe=enfant> test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test </td> </tr> </table></body>Effet
2. marge gauche : -50px ; marge supérieure : -50px ;
<style> .parent{ position : relative ; couleur d'arrière-plan : jaune ; largeur : 500 px ; hauteur : 200 px } .child{ largeur : 100 px ; ; gauche : 50 % ; marge-gauche : -50px ; marge-haut : -50px } </style>Effet
3. transformer : traduire (-50 %, -50 %)
<style> .parent{ largeur : 500 px ; hauteur : 300 px ; bordure : solide 1px rouge ; position : relative ; } .child{ largeur : 200 px ; bordure : 1px noir uni ; ; gauche:50%; transformer: traduire(-50%,-50%) } </style>Effet
4. marge : auto ;
<style> .p{ largeur : 300 px ; hauteur : 200 px ; bordure : 1px rouge uni ; position : relative ; } .c{ hauteur : 40 px ; ; haut : 0 ; bas : 0 ; gauche : 0 ; droite : 0 } </style>Effet
5. Boîte souple
<style> .p{ bordure : 1px rouge uni ; largeur : 400px ; hauteur : 500px ; : rouge; } </style>Effet
Quelles sont les nouvelles fonctionnalités de html5CSS3 et quels éléments ont été supprimés ? Comment gérer les problèmes de compatibilité des navigateurs avec les nouvelles balises HTML5 ? Comment différencier HTML et HTML5 ?HTML5 n'est plus un sous-ensemble de SGML, il s'agit principalement de l'ajout d'images, de localisation, de stockage, de géolocalisation et d'autres fonctions.
Élément de toile de peinture
éléments vidéo et audio pour la lecture multimédia
Stockage local hors ligne localStorage stocke les données pendant une longue période et les données ne sont pas perdues après la fermeture du navigateur ;
Les données de sessionStorage sont automatiquement supprimées après la fermeture du navigateur
Éléments de contenu avec une meilleure sémantique, tels que l'article, le pied de page, l'en-tête, la navigation, la section
Contrôles de formulaire, calendrier, date, heure, e-mail, URL, recherche
CSS3 implémente des coins arrondis, des ombres, des effets spéciaux sur le texte et ajoute plus de sélecteurs CSS et rgba multi-arrière-plan
Webworker nouvelles technologies, websockt, Géolocalisation
élément supprimé
Éléments purement expressifs : basefont, big, center, font, s, strike, tt, u ;
Éléments ayant un impact négatif sur la convivialité : frame, frameset, noframes ; balises de support IE8/IE7/IE6 générées via la méthode document.createElement.
Cette fonctionnalité peut être utilisée pour permettre à ces navigateurs de prendre en charge les nouvelles balises HTML5.
Une fois que le navigateur a pris en charge la nouvelle balise, vous devez également ajouter le style par défaut de la balise : bien sûr, le meilleur moyen est d'utiliser directement un framework mature, et le plus utilisé est le framework html5shim.
- <!--[if lt IE 9]><script> src=http://html5shim.googlecode.com/svn/trunk/html5.js</script><![endif]-->
Ce qui précède représente l’intégralité du contenu de cet article. J’espère qu’il sera utile à l’étude de chacun. J’espère également que tout le monde soutiendra le réseau VeVb Wulin.