L'Education numérique avec Tice-Education

  • word    
  • writer
  •   excel  
  • calc
  • powerpoint
  • impress
  • chrome
  • firefox
  • safari
  • ie-10-logo
  • ipad 
  • el capitan logo
  • macosx
  • Windows 10
  • linux
  • nexus4
  • android
  • tbi
  • pdf
  • archive black zip 128
  • scratch
  • langage
  • 01010101
  • scratch algo
  • sublimetext ecran
  • cardboard box blue 128
  • robots 
  • Imprimante 3D 
  • car 
  • videoprojecteur 

 toutpublic Générez des boutons en CSS3 sans programmation

buttonX logoLe CSS3 est le nom employé pour caractériser l’ensemble des nouveautés depuis le CSS2.1. Il permet, par exemple, de définir de nouveaux effets à appliquer sur les éléments HTML et donc de réaliser des effets visuels assez impressionnants. Le site webarti.com propose un service gratuit en ligne pour créer des boutons en CSS3 (avec des effets) sans saisir la moindre ligne de code CSS et sans aucune ligne  javascript dans la page web.


Comment faire ?

1) Conception du bouton

  • Saisr le texte de son bouton en haut de la page
  • Régler tous les paramètres à droite avec les curseurs (à la souris) :
    • Font Size, Border Radius, Border Size, Vertical Size, Horizontal Size,  Box Shadow, Vertical Position, Horizontal Position etc

  • Sélectionner sous le bouton les couleurs via les mélangeurs, fond, texte, bordure etc
  • Cliquez sur le bouton pour générer le code CSS3

 

buttonX ecran

 2) intégration à la page web

  • Coller le code CSS. généré plus haut dans la page Css de votre site.
  • Dans votre page web Insérer le lien vers votre fichier CSS dans la balise head de votre page du type : <link href="/css/testcss3.css" rel="stylesheet" type="text/css" />
  • Insérer le lien du bouton à l'endroit voulu dans votre page web  <a href="#" class="myButton">Tice Education</a>
  • Tester dans votre navigateur

 Une application sympatique, simple qui permet de concevoir des boutons avec des effets CSS3 sans partiquement aucune connaissance. A tester...

Plus d'informations ici : http://webarti.com/best-CSS3-button-maker/

Pour écrire un commentaire, merci de se connecter :
- Les messages déplacés et les critiques non argumentées seront supprimés.
- Le langage SMS est banni et les liens commerciaux sont interdits.

L'équipe Tice-Education

Newsletter

Actualité de l'Éducation numérique
captcha 

Devenir Membre

Pour vous informer sur l'école numérique (Tice), le codage, l'algorithmique, TNI... Totalement Gratuit !

S'inscrire