Pas encore inscrit ? Creez un Overblog!

Créer mon blog

Trucs et astuces en CSS et HTML

Vous avez trouvé un truc pour illuminer votre blog, vous avez récupéré sur le web une magnifique astuce, vous avez imaginé un bout de HTML pour améliorer la présentation, vous avez développé un petit widget, venez le faire savoir ici. Cette communauté accueille tous les blogueurs, même débutants ou peu expérimentés, pour partager leur savoir dynamisant nos blogs.

Gérée par Le Chevalier Dauphinois

14 blogs

24 posts

28/04/2015

Rejoindre

Articles récents de cette communauté

Afficher les prévisions météo de n'importe quel endroit dans le monde

Afficher les prévisions météo de n'importe quel endroit dans le monde

Plan your trip Local Radar Detailed Forecast On trouve des gadgets météo sur le site de Woundeground . Comment préparer l'affichage météo de sa ville Taper dans la zone de recherche en haut la ville souhaitée. Aller ensuite tout en bas, à gauche, sur le "Free Weather Stickers® for Your Homepage" et un clic sur le bouton "Get Your Weather St
Changer le curseur de la souris sur un article

Changer le curseur de la souris sur un article

Voici comment changer le curseur de la souris sur les articles de votre blog C'est un petit code bien utile car il fait de l'effet et ne manquera pas d'épater vos visiteurs ! 1. Trouver des curseurs animés Vous trouverez facilement des curseurs animés sur la grande toile. Je vous conseille d'ailleurs de faire plutôt votre recherche avec le mot
Comment intégrer "Lire la suite" pour éviter de surcharger un article

Comment intégrer "Lire la suite" pour éviter de surcharger un article

1. Utiliser un "Lire la suite" Il arrive que l'on fasse des articles un peu longs, ou tout au moins, dont certains détais n'interresseront pas tous nos visiteurs. Il est utile dans ce cas, à la suite d'un texte d'accroche, composé le plus souvent de 1 à 5 lignes, de faire un "Lire la suite", sur lequel le visiteur doit cliquer pour accéder à
Code HTML pour "Lire la suite"

Code HTML pour "Lire la suite"

1. Utiliser un "Lire la suite" Il arrive que l'on fasse des articles un peu longs, ou tout au moins, dont certains détais n'interresseront pas tous nos visiteurs. Il est utile dans ce cas, à la suite d'un texte d'accroche, composé le plus souvent de 1 à 5 lignes, de faire un "Lire la suite", sur lequel le visiteur doit cliquer pour accéder à
Les principales balises HTML

Les principales balises HTML

Voici une liste non exhaustive des principales balises HTML utilisées, avec leur définition. Pour en savoir + sur l'HTML, allez voir l'article consacré ICI . Balise HTML Description <!-- --> Commentaire. <a> Création d'une ancre pour liens hypertexte. <area> Permet de définir une zone cliquable dans la page. <b> Gras. <body> Encadre le corps d
Faire un texte en dégradé de couleurs

Faire un texte en dégradé de couleurs

F a i r e u n j o l i t e x t e e n d é g r a d é avec les couleurs de votre choix 1. Les dégradés de couleurs Utiliser un dégradé de couleurs est un bon moyen pour embellir vos textes et faire ressortir un texte par rapport à un autre. 2. Code HTML pour les dégradés de couleurs Vous savez déjà mettre de la couleurs sur vos texte. Pour u
les 5 règles d'Or pour construire votre site web

les 5 règles d'Or pour construire votre site web

Pour que votre site plaise, qu'il soit correctement référencé, que vos visiteurs reviennent, il faut respecter quelques principes : Et oui, vos visiteurs ont déjà vus beaucoup de sites, ils sont habitués à certains standard et il faut qu'ils les retrouvent chez vous, sous peine d'être perdus dans la navigation, trompés dans leurs habitudes
Installer une radio sur votre blog

Installer une radio sur votre blog

Vous voulez offrir la possibilité à vos visiteurs d'écouter la radio quand ils visitent votre blog ! J'ai le gadget qu'il vous faut ! Comment installer le lecteur radio sur son blog C'est très facile, il suffit d'aller dans un article, ou plus vraisemblablement un module de votre blog (afin que la radio apparaisse quelle que soit la page visit
Ajouter un effet apparition/disparition cercle sur votre texte

Ajouter un effet apparition/disparition cercle sur votre texte

Votre texte qui apparait avec un effet cercle. Joli non ? Créer votre texte qui apparait/disparait avec un effet de cercle Si vous voulez faire pareil, allez chez CrazyProfile ! Taper votre texte (pas trop long, malheureusement ! Clic sur "Preview" pour voir le résultat. Si cela vous convient, Clic sur GetCode et vous voilà avec votre code HTML.
La programmation en langage html, c'est quoi ?

La programmation en langage html, c'est quoi ?

Quand on a un blog, on, entend beaucoup parler de HTML et de CSS. N'ayez pas peur, ça ne mord pas ! Ce ne sont que des langages de programmation, codés en anglais, qui permettent de faire des pages internet. HTML signifie Hypertext Markup Language . Il est constitué de "marques" ou "balises" qui permettent d'identifier les éléments d'une page.
Mettre votre texte dans un ascenseur, dans un article

Mettre votre texte dans un ascenseur, dans un article

Pour éviter d'avoir des articles trop longs, il peut être utile de mettre certaines informations dans des ascenseurs. Le texte à mettre dans l'ascenseur doit être entouré d'un code HTML ; lire cet article pour savoir comment faire 1. Mettre du texte dans un ascenseur (Scrollbar) Pour ne pas que votre article soit trop long, il peut être utile
La photo la plus drole du jour

La photo la plus drole du jour

Ce gadget pour décorer votre blog avec la photo la plus drole du jour ! Code en script du gadget "photo drole du jour <script src="http://www.gmodules.com/ig/ifr?url=http://www.digitalpowered.info/gadget/models.xml&amp;synd=open&amp;w=320&amp;h=550&amp;title=La+photo+la+plus+rigolote+du+jour&amp;border=%23ffffff%7C0px%2C1px+solid+%23993333%7C0px%2
Une pluie d'étoiles qui suit votre curseur

Une pluie d'étoiles qui suit votre curseur

Suite à la demande de certains de mes visiteurs, je vous donne ici le code HTML pour faire apparaître une pluie d'étoiles au bout de votre curseur (ou de votre souris). Particularités du code HTML de la pluie d'étoiles La particularité de ce code est qu'il se suffit à lui-même : - Il ne nécessite pas de charger des photos d'étoiles, comme
Mettre un texte non visible en mode HTML

Mettre un texte non visible en mode HTML

Quand on écrit du code HTML, on a parfois besoin de noter des commentaires, non visibles pour les visiteurs. Ces commentaires sont des indications pour mieux s'y retrouver dans le code. Ils peuvent : * indiquer la nature du code, * indiquer pourquoi telle ligne a été ajoutée, * faire office de trait de séparation pour "aérer" le code, * ou bi
Faire des listes cliquables en langage HTML

Faire des listes cliquables en langage HTML

Il est parfois utile de faire des listes dans ses articles afin d'alléger le texte et d'ordonner ses éléments. C'est ce que j'ai fait, par exemple, dans mon article " Index des articles ". Dans ce cas, chaque élément de la liste est cliquable et permet d'accéder à une autre page du blog. 1. Code HTML pour faire une liste cliquable. Principe
Utiliser un gravatar sur son site (avatar pour commentaires)

Utiliser un gravatar sur son site (avatar pour commentaires)

1. Qu'est ce qu'un gravatar ? Gravatar est un service web qui vous propose d'associer un avatar à votre adresse mailsur le web. En clair, cela signifie que dès que vous surferez sur le web en étant connecté avec votre adresse mail, votre avatar sera automatiquement ajouté à vos commentaires. Il faut tout de même que le site les autorise ! 2.
Aide - Un curseur faisant une pluie d'étoiles

Aide - Un curseur faisant une pluie d'étoiles

La pluie d'étoiles Promener votre curseur dans cet article. Voyez vous les étoiles créées par le curseur ? Ceci est très facile à faire. Un simple copier/coller en 4 étapes. Le code html (à mettre dans le source de votre article) Etape 1 : * Question à se poser : "Quelle doit être la couleur de mes étoiles ?" * Une fois définie, vous de
Widget - 1 mapping avec 3 roll-over

Widget - 1 mapping avec 3 roll-over

Le but de ce petit "truc" est de faire apparaitre de nouvelles images (3 dans cet exemple) en mettant la souris sur des zones définies . Pas besoin de cliquer . Voici l'image Dans cette image, il faut trouver ZOE (une peluche). En mettant le curseur dans le feuillage, une aide est proposée . Le code html (à mettre dans le source "html" de votre
Widget - Exemple menu statique 1

Widget - Exemple menu statique 1

Exemple 1 exemple 2 exemple 3 exemple 4 Voici le code à mettre dans le html <table border="0" bordercolor="#000000" align="center"> <tbody> <tr> <td><a class="menu3" title="blabla exemple 1" href="http://chateau.over-blog.net/article-13475146.html">Exemple 1</a></td> <td><a class="menu3" title="blabla exemple 2" href="http://chateau.over-blog.net/
Agrandir des images dans un tableau sans faire un clic

Agrandir des images dans un tableau sans faire un clic

Avant tout, j'aimerais remercier Gifman pour cette astuce qu'il a développée. Je n'ai fait que la mettre en forme pour mon besoin. Allez voir son blog passionnant --> clic -------------------------------------------------------- Le but est d'afficher une image au centre d'un tableau en mettant simplement le curseur sur une des 6 images mignatures
Widget - Image s'affichant sur un mot (sans clic)

Widget - Image s'affichant sur un mot (sans clic)

But Le but de cette astuce est d'afficher une image sur un mot sans faire un clic de souris. Il suffit de poser le curseur sur le mot ou la phrase. Voici deux exemples Posez votre curseur ici Ou posez le là Autre exemple Cette astuce est utilisée sur ce blog. Le code à mettre dans le CSS (A ne pas mettre dans le html de votre article) ==> Il suf
Widget - Traduction 24 langues

Widget - Traduction 24 langues

Ce petit widget traduit votre texte Français dans l'une des 24 autres langues. Voici l'image affichée Le code html (à mettre dans le source de votre article) <div> <a title="Google-Traduction-Fran&ccedil;ais-en-anglais " onclick="window.open('http://www.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=fr%7Cen&amp;hl=fr&a
Widget - Météo sur 1 jour avec informations

Widget - Météo sur 1 jour avec informations

Ce petit widget affiche la météo du jour et permet un lien vers un site d'informations de la ville choisie. La météo est moyennement fiable. Voici l'image affichée Avec ce code, en cliquant sur l'image, vous affichez la page d'accueil du site "LesVilles.com". Avec ce code, en cliquant sur l'image, vous affichez la page de la ville choisie sur
Liste des Widgets et Astuces

Liste des Widgets et Astuces

Les widgets sont des petits "gadgets" amusants et parfois utiles agrémentant nos blogs et sites web. Je vais tenter de vous lister les plus fiables, après les avoir testés bien sur. J'enlève donc mon armure de Chevalier Dauphinois et j'enfile l'imperméable de l'inspecteur gadget. Légende : S= S ans Javascript J = Widget possédant du Javascri