Créer un bouton pur menu CSS, toujours Twisted
Si vous me avez suivi sur les Twitters pendant un certain temps, vous saurez mes réflexions sur la meilleure solution pour la navigation mobile. En bref. Je déteste l'idée d'utiliser un
En utilisant
Maintenant, j'ai aussi pensé à quel point nous devons penser à ce que nous offrons en fait la personne avec leur (insérer un appareil mobile de poche, mais) iPhone.
Certaines options.
Vous voyez, la création d'une nouvelle image pour l'icône du menu pourrait créer une autre requête http (bien que vous pouvez (et doit) créer une image-objet css de « toutes les choses » comme ça, mais vous auriez encore que kb supplémentaire à télécharger).
Vous pouvez utiliser une police d'icône. mais encore une fois cela créerait une autre requête http et aussi un fichier dont vous n'utilisez pas toutes ses parties. Bien qu'il puisse bien l'échelle (ou non) pour un bouton de menu de votre appareil tactile de poche, il est un peu exagéré.
Numéro de porte 3.
Je pense que, d'une façon de créer votre bouton de menu de navigation mobile 3 ligne est d'utiliser CSS. Pure CSS. Il va ajouter quelques lignes de code à votre fichier CSS, mais serait un peu plus agréable pour l'utilisateur d'avoir de ne pas télécharger plus de choses pour un seul bouton.
Donc, pour créer un simple bouton de menu 3 lignes que vous aurez besoin d'écrire quelque chose qui ressemble à cela -
Maintenant, le seul problème avec la création de quelque chose comme ceci est une div vide, c'est assez merdique, mais je vais arriver à ce poste dans un plus tard. Concentrons-nous seulement sur la création CSS fraîche seuls les boutons de menu.
Ici, vous pouvez voir que nous avons ajouté une bordure autour des lignes avec la .btn de classe. En procédant ainsi, signifie que toutes les règles CSS pour #lines seraient les overide. Par conséquent, nous avons utilisé le: avant sélecteur de pseudo pour obtenir un bon résultat.
Il y a plus?
Bien sûr, il y a plus. Bien que j'aime le menu 3 lignes, après une récente discussion sur twitter, il ne fonctionnera pas vraiment si vous avez des sous-navigation dans le menu principal. Beaucoup de 3 icônes de ligne tout pile sur l'autre, il peut être déroutante. Donc, j'ai créé quelques boutons supplémentaires sur CSS.