WebVisible

Sites Web et visibilité sur internet

Astuce CSS : se creer sa propre Icône Wifi !

3 avril 2013

Vous rêviez de pouvoir faire vos propres formes uniquement en CSS, voilà une petite astuce pour générer une icône ressemblant comme deux gouttes d’eau au symbole “WIFI”.
Voila ce à quoi devrait ressembler le résultat :
icone wifi réalisé en css

en soit, on se rend compte que ce n’est pas hyper compliqué à mettre en place, il suffit de “courber quelques traits” comme le dit david sur cette page : http://degliame.net/icone-wifi-astuce-css/ …

Sur l’article cité en source on apprend comment utiliser quelques lignes de CSS pour styliser quelques balises HTML et leurs donner les formes que l’on souhaite.

La plupart des méthodes proposent de créer de multiples éléments html.
Mais comme le rappel l’article en étudiant un peu les propriétés CSS disponibles, on peut styliser seulement un élément html.
le résultat est disponible sur ce dabblet.

Bien sur, il faut réfléchir à la bonne utilisation de cette technique, ce n’est pas parce que l’on peut le faire qu’il faut forcement le faire.
Dans la plupart des cas, il est plus judicieux d’utiliser d’autres techniques, comme par exemple la technique des sprites d’images, ou l’utilisations d’images vectorielles, voire même encore dans le cas où il y’a beaucoup d’éléments différents à afficher : la création et l’utilisation d’une police personnalisé incluant toutes les formes souhaités. Ainsi on bénéficie de toutes les avantages du vectoriel avec la possibilité d’utiliser un grand nombre de propriétés Css pour personnaliser la position, la couleurs, l’angle, la forme, la graisse, la décoration etc …

Classé sous :intégration

Laisser un commentaire Annuler la réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Articles récents

  • WordPress : Apprenez à bien gérer vos utilisateurs !
  • La méthode Prince2
  • Les nouveaux services de créations de contenus
  • Peut-on toujours se positionner sans cocon sémantique ?
  • Résoudre les problèmes avec Contact Form 7
  • Les Verbes d’actions
  • La piste de l’attaque subit par Mavenhosting
  • Quels garanties pour du référencement ?
  • Le pirate de Mavenhosting serait identifié
  • Les Ping – services de mise à jour
  • Hack MavenHosting
  • Utiliser les flux rss d’un compte twitter
  • Astuce CSS : se creer sa propre Icône Wifi !
  • Optimisation des sites web
  • 53 changements chez google en Avril 2012

partenaire du mois

Si vous recherchez un partenaire fiable à Paris, Web Artem est l'agence de référencement naturel qui peut vous aider à gagner en visibilité sur les moteurs de recherche et à attirer de nouveaux clients.

Le FrameWork Genesis pour WordPress !

Genesis Theme Framework for WordPress

Le FrameWork Genesis pour WordPress !

Genesis Theme Framework for WordPress

Articles récents

  • WordPress : Apprenez à bien gérer vos utilisateurs !
  • La méthode Prince2
  • Les nouveaux services de créations de contenus
  • Peut-on toujours se positionner sans cocon sémantique ?
  • Résoudre les problèmes avec Contact Form 7
  • Les Verbes d’actions
  • La piste de l’attaque subit par Mavenhosting
  • Quels garanties pour du référencement ?
  • Le pirate de Mavenhosting serait identifié
  • Les Ping – services de mise à jour
  • Hack MavenHosting
  • Utiliser les flux rss d’un compte twitter
  • Astuce CSS : se creer sa propre Icône Wifi !
  • Optimisation des sites web
  • 53 changements chez google en Avril 2012

Solutions Web

Solutions de visibilité et de sites web

•••

En savoir plus ▾

  • A propos de WebVisible.fr