Maison >interface Web >tutoriel HTML >Analyse des styles d'écriture HTML expérimentés et des raisons_HTML/Xhtml_Production de pages Web

Analyse des styles d'écriture HTML expérimentés et des raisons_HTML/Xhtml_Production de pages Web

WBOY
WBOYoriginal
2016-05-16 16:42:001091parcourir

1. Navigation : liste non ordonnée par rapport aux autres éléments de balise
Analyse des styles décriture HTML expérimentés et des raisons_HTML/Xhtml_Production de pages Web
La raison pour laquelle on utilise la "liste non ordonnée" la plus couramment utilisée pour écrire la navigation est Évidemment, il représente une liste de liens, ce qui en soi est une raison suffisante pour sélectionner l'étiquette de la liste. Mais le style par défaut de la liste doit être supprimé pour lui donner plus de sens.
Un autre avantage peut dépasser votre imagination : vous créez une liste et y ajoutez un lien, et vous pouvez utiliser CSS pour contrôler et définir une chaîne d'éléments dans la liste.



2. Chemin (fil d'Ariane) : p balise de paragraphe vers la balise de liste
Analyse des styles décriture HTML expérimentés et des raisons_HTML/Xhtml_Production de pages Web

Nous pouvons discuter de ce problème ensemble. Si vous avez d'autres meilleurs moyens, veuillez nous le faire savoir. Personnellement, je préfère écrire des chemins (fil d’Ariane) en utilisant un code comme celui-ci. (Cependant, je n'utilise pas souvent le symbole >>).

<p id="breadcrumbs"><a href="#">首页</a> » <a href="#">关于我们</a> </p>

Le chemin du site Web (fil d'Ariane) a une relation hiérarchique dans une certaine page. Logiquement, la liste devrait être imbriquée pour montrer la relation hiérarchique, mais s'il n'y a qu'un seul élément dans votre liste, qu'en pensez-vous ? Quel genre de situation ? Personnellement, je pense que le chemin de la page Web (fil d'Ariane) doit être affiché sur une seule ligne.

3. Bouton versus Entrée
Je ne me souviens pas de la dernière fois que j'ai utilisé input type="submit", mais j'ai arrêté de l'utiliser il y a longtemps pour deux raisons : Pourquoi le faire. vous devez entrer type="submit" pour l'élément bouton ? Le bouton est son propre élément. Le bouton est facile à identifier dans le code et à définir en utilisant CSS (tous les anciens navigateurs ne prennent pas en charge cet attribut de balise d'élément). Et cela nous permet également d'écrire d'autres éléments de balise à l'intérieur, élargissant ainsi nos possibilités de plasticité.

<button type="submit">Submit Form</button>

4. Laisser un message : liste ordonnée (ol) vs. liste non ordonnée (ul)
Analyse des styles décriture HTML expérimentés et des raisons_HTML/Xhtml_Production de pages Web02
la liste est vraiment géniale ! Il existe 3 types différents (liste ordonnée, non ordonnée et définie) et chacun a son propre objectif. Peut-être que vous ne savez pas quand utiliser une liste ordonnée (ol) et quand utiliser une liste non ordonnée (ul), car elles ont du sens lorsqu'elles sont utilisées. Les messages ressemblent un peu aux exemples du manuel, qui sont soigneusement classés par ordre chronologique, triés naturellement vers le haut. Chaque commentaire correspond à une heure fixe, la structure du commentaire doit donc utiliser une liste ordonnée (ol).

<ol>
	<li>
	<ul>
	<li><img src="path-to-gravatar.gif" alt="Author's name"></li>
	<li><a href="url-to-authors-homepage.html">Author's name</a></li>

	<li>posted on date-goes-here</li>
	</ul>
	<div>Comment text goes here...</div>
	</li>
</ol>

5. label/input : div Pour les autres éléments d'étiquette
Analyse des styles décriture HTML expérimentés et des raisons_HTML/Xhtml_Production de pages Web03
, définissez la structure parent en dehors de label/input. le meilleur ? Quel est un bon choix ?

<label for="contactName">Your Name</label>
<input type="text" name="contactName" id="contactName">

L'utilisation de codes d'étiquette appropriés peut être discutée dans le passé, mais maintenant je choisis toujours d'utiliser div pour intégrer l'étiquette/l'entrée. L'étiquette et l'étiquette associée sont considérées dans leur ensemble. L'élément div possède un large éventail de propriétés sémantiques et peut s'adapter à n'importe quelle situation.

<div>
	<label for="contactName">Your Name</label>
	<input type="text" name="contactName" id="contactName">
</div>

Texte original chinois : Mes 5 préférences d'écriture html
Texte original anglais : Mon Top 5 des préférences de codage HTML

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