Informatique / Blogs

❥blog/conception ❥Précieux ❥Pensées/poèmes ❥Voyage *Accueil

Conception / Informatique / Blog

" Sites à visiter "

01) Wordle : I c i

Faire un montage de présentation

A voir ...

02 ) Bancreator : I c i

Créer gratuitement
- des gifs animés,
- des bannières web
- des images animées

03 ) Dafont : I c i

& Fontriver : I c i

Ajouter selon son choix des polices
et ainsi agrémenter sa présentation,
ses créations ...

4 ) Weecast : I c i

et Ici
Dans les utilitaires, comprendre
certaines expressions informatiques,
un grand nombre de logiciels
on y trouve des vidéos et des tuto.

5 ) Developpez : I c i

Un site pour les passionnés d'informatique

6 ) Toutimages : I c i et I c i

conception des blogs

7 ) Grsites : I c i

De nombreuses textures pour les blogs
des polices
des fonds sonores ...

8 ) Drawter : I c i

En cherchant a répondre à mes intrrogations,
j'ai trouvé ce service.

Drawter permet

de génèrer les codes de votre site.

On place les zones voulu et on obtient

les codes HTML et CSS que l'on souhaite.

Cela permet de dépanner lorsque
l'on a du mal avec les codes sources ...

9 ) Blog Tuto ; un clic sur l' image
pour le visiter

10 ) : Cooltext : I c i

Générateur de graphiques,

de logos ...

11 ) : Touches clavier nécessaires

pour obtenir les écris suivants

Alt + 0223 = ß
Alt + 2 ☻ (un smiley)
Alt + 3 = ♥ (coeur au fond rempli)
Alt + 5 = ♣
Alt + 6 = ♠
Alt + 7 = •
Alt + 9 = ○
Alt + 10 = ◙
Alt + 11 = ♂
Alt + 12 = ♀
Alt + 13 = ♪
Alt + 15 =☼ (soleil)
Alt + 14 =♫ (note de musique double)
Alt + 18 = ↕
Alt + 19 = ‼
Alt + 20 = ¶
Alt + 21 = §
Alt + 24 = ↑
Alt + 25 = ↓
Alt + 26 = →
Alt + 27 = ←
Alt + 28 = ∟
Alt + 29 = ↔
Alt + 30 = ▲
Alt + 31 = ▼
alt + 145 = æ
Alt + 157= Ø
Alt + 155= ø
Alt + 168 = ¿
Alt + 169 = ®
Alt + 170 = ¬
Alt + 174 = «
Alt + 175 = »
Alt + 177 = ▒
Alt + 178 = ▓
Alt + 180 = ┤
Alt + 184 = ©
Alt + 185 = ╣
Alt + 186 = ║
Alt + 187 = ╗
Alt + 188 = ╝
Alt + 189 = ¢
Alt + 190 = ¥
Alt + 191 = ┐
Alt + 192 = └
Alt + 193 = ┴
Alt + 194 = ┬
Alt + 195 = ├
Alt + 196 = ─
Alt + 197 = ┼
Alt + 200 = ╚
Alt + 201 = ╔
Alt + 202 = ╩
Alt + 203 = ╦
Alt + 204 = ╠
Alt + 205 = ═
Alt + 206 = ╬
Alt + 208 = ð
Alt + 209 = Ð
Alt + 213 = ı
Alt + 217 = ┘
Alt + 218 = ┌
Alt + 219 = █
Alt + 220 = ▄
Alt + 225 = ß
Alt + 231 = þ
Alt + 232 = Þ
Alt + 238 = ¯
Alt + 241 = ±
Alt + 242 = ‗
Alt + 246 = ÷
Alt + 250 = · (différent du point normal .)
Alt + 251 = ¹ (exposant 1)
Alt + 252 = ³ (exposant 3)
Alt + 253 = ² (exposant 2)
Alt + 254 = ■
Alt + 433 ▒
Alt + 434 ▓
Alt + 499 = Ÿ
alt +754 = ‗
Alt + 785 = ◄
Alt + 925 = Ø
alt + 999 = þ
Alt + 3331 = ♥
alt + 12151214 = «
alt + 12151215 = »

❥

12 ) Abode atelier vidéo

explications et vidéos sur les utilisations

d' Abode et avec divers applications

- textes animés

- animation de calques

- création de 3 D

- ...

I c i

css

Quelques explications

Quelques bases

CSS, ca signifie Cascadinf StyleSheet.

Cascading, veut dire que les éléments de structure

appellent les éléments de design les uns après les autres

Les lignes CSS sont lues dans l'ordre,

la dernière ligne ayant toujours le dessus sur celles qui sont au dessus.

Sur au moins 5 parties qui se définissent ainsi :

à savoir

- A utiliser dans configurer

- Pour une structure à 3 colonnes

(les modules à placer au mieux

dans les 2 colonnes de modules)

- Design : en choisir un qui est mdifiable,

puis aller dans disign CSS. Cocher la fonction spécifique CSS

pour modifier soi-même selon son propre design,

qui remplacera celui de base.

- cocher "modifier l'héritage" et décocher

les 4 cases d'héritage qui définissaient les

éléments modifiés et redéfinis.

*************************
* Structure: 3 colonnes *
*************************

Ces lignes permettent de définir l'aspect global du blog

(positions, fond et bordures des colonnes)

body {margin: 2px; background: #CCC;} /* fond general du blog */

#global {border: 1px solid black; background: #DDD; margin: auto; width: 94%; } /* Pour centrer le blog */

#top {border: 0px; margin: 5px; } /* Entete */

#cl_1_0 {border: 1px solid #A17272; background: #D2BDBD; width: 20%; position: float; float: left; margin: 0px 5px; padding: 3px;} /* Colonne n 1 */

#cl_1_1 {border: 1px solid #A17272; background: #D2BDBD; width: 54%; position: float; float: left; margin: 0px 2px; padding: 5px;} /* Colonne articles */

#cl_1_2 {border: 1px solid #A17272; background: #D2BDBD; width: 20%; position: float; float: right; margin: 0px 5px; padding: 3px;} /* Colonne n 3 */

#footer {margin: 5px; padding: 3px;} /* pied de page */

********************************
* Styles pratiques, à connaitre *
********************************

Ces lignes permettent de modifier les styles qui sont souvent utilisés :

titres, liens, images, formulaires...

h2 {display: block; text-align: center;} /* Alignement de tous les titres */

a img {border: 0px;} /* supprimer les bordures sur les images

qui servent de lien */

a:visited, a {color: #fff;} /* liens (déjà visites ou non) */

input, textarea {font-size: 90%; border: 1px solid #ffffff; background: #A17272; color: white; padding: 0px 3px;} /* les champs des formulaires */

form {margin: 0px; padding: 0px;} /* espaces autour des formulaires */

blockquote {border: 1px solid black; background: #FFF; padding: 5px;} /*

encart de tabulation, pour presenter le code */

***********
* Modules *
***********

Ces lignes permettent de relooker les modules.

D'abord de façon générale, puis de façon détaillée pour certains.

.box-titre h2 {font-size: 15px; color: #933; text-decoration: none; margin: 0px; margin-top: 5px;} /* Titres des modules */

.box-content {font-size: 100%; border-bottom: 3px solid #A17272; padding-bottom: 5px;} /* Contenu des modules */

.box-footer {display: none;} /* Bas des modules */

.recherche {text-align: center;} /* module recherche */

.newsletter {text-align: center;} /* module newsletter */

************
* Articles *
************

Ces lignes permettent de présenter les articles correctement

(y compris une ligne pour les commentaires).

.article {text-align: justify;} /* Contenu des articles */

.afterArticle a {padding-left: 15px; } /* lien commentaires */

.afterArticle {text-align: right; padding-bottom: 5px; margin-top: 10px; margin-bottom: 25px; border-top: 1px solid #A17272;} /* lignes apres les articles (publie par + commentaires */

.commentMessage, .commentOption {background: orange; padding: 3px;} /*

Le commentaire et son auteur */

.date {font-size: 90%; text-align: right;} /* format et position de la date */

*************************
* Liens du pied de page *
*************************

Ces lignes montrent que l’on peut vraiment modifier l'aspect de tout.

Pas très utile dans ce cas, sauf que les liens auraient été blanc sur fond clair: illisible.

#footer a {color: black; text-decoration: none;} /* lien dans le pied de page */

#footer a:hover {text-decoration: underline;} /* liens survoles */

---

...Quelques liens sur le CSS...

13 ) CSS3 CSS Transforms

Créez des effets sympathiques avec CSS 3

en quelques étapes simples.

CSS3 CSS Transforms

Faites pivoter, redimensionnez, inclinez

ou par ailleurs transformez les éléments HTML et CSS 3.

Découvrez ce site (compatible avec Opera 10.5,

Firefox 3.5 et Safari 4 et plus).

Vous pouvez choisir entre une animation 2d ou 3d.

L’interface est graphique et simple d’utilisation.

Quand vous obtenez le résultat voulu il ne vous reste qu’a copier

et coller le code fourni par le site dans votre feuille de style.

Vous avez aussi d’autres outils très utiles comme Shadows,

CSS Text Stroke et encore Gradients. Visitez ce site

CSS3 Please.com

Modifiez les valeurs et ayez un aperçu directement avec ce site .

Plus de prise de difficultée, tout est fait automatiquement pour vous.

Vous pouvez copier tout ou une partie des codes

et les coller dans votre propre feuille de style chaque fois

que vous le souhaitez.

Et vous qui pensiez qu’il fallait des super connaissances

en CSS pour y arriver …

Pour visiter le site, cliquez ici.

Border radius.com

Voici un site qui vous fera certainement gagner du temps

si vous cherchez à faire des conteneurs avec les coins arrondis.

Interface simple, épurée, classe…

Entrez les valeurs que vous souhaitez dans les 4 cases se trouvant

à côtés des coins et récupérez ensuite le code

à l’intérieur du conteneur. cliquez ici.

14 ) Css3 marker

Un outil qui pourra aider, un générateur permet de créer des éléments

On peut créer des ombrages,

des animations

ou encore des textes avec des polices d’écritures spéciales,

le tout en utilisant un seul outil.

Le CSS n’aura ainsi plus de secret et peut être utilisé pour un blog.

à ce lien ici

15) Templates

différentes présentations

à télécharger

à ce lien ici

16) Horloges

De jolies horloges pour vos blogs

à ce lien ici

17) Générateur de couleurs

à ce lien ici

18) sites et blogs interessants

avec leurs astuces ...

pour les blogs

- à ce lien ici

19) Pour créer des fonds de blog

- générateur ici

- ici

20) I-services

Modules ou services clé en mains

ou services gratuits pour les blogs

- ici

21) Link with in

ajouter des images à la page principale

et un lien vers chacun des articles

lien aux images défilantes ...

ce principe se voit sur de nombreux sites ...

culinaires par exemple, ou d' achats...

(widjet gratuit)

à ce lien ici

22) de jolis thèmes de blog

à ce lien ici

23) créer un web site ou autre

en flash et gratuit

à ce lien ici

24) Presse citron

Un site très interessant pour ceux qui aiment

le design des blogs, la création ...

à ce lien ici

25) Dynamic drive

des codes htlm, javascript...

pour animer les blogs

à ce lien ici

26) Dico info

Des explications simples

concernant les mots sur le net

et informatique

à ce lien ici

27) Modification des blogs

des astuces, des codes à voir

un site très interessant pour Blogger ou autre

à ce lien ici

28) Trucs et astuces

pour Blogger

et autres

à ce lien ici

29) animations

créer une image animée : ici

30) Générateurs

- de barre flottante : ici

- de liste déroulante : ici

- de CSS des titres : ici

- de liens texte et image : ici

- de texte défilant : ici

31) Savoir tout faire

un site interessant : ici

32) Comment faire un gif ...

Tutoriel

33) Comment faire un gif animé ...

Tutoriel

site gicker.com : ici

34) informatique / divers

site à consulter :

- "Partage du savoir /informatique" : ici

ordinateurs (78)

☻ Présentation

Retour à la page d'accueil
Blog : Graindesable972
Catégorie : Loisirs Culture Musique Cuisine Décoration Divers
Description : Mon blog, un espace de détente où je viens déposer mes petites inspirations du moment... mes centres d' intérêt : la photographie, la création, la musique, l'informatique, la décoration, l'artisanat, les loisirs créatif,les arts en général, la lecture, la poésie, la spiritualité, la philosophie, la médecine, l'architecture, les expositions, le cinéma, les voyages, l'ici et l'ailleurs,la cuisine,la nature, le jardinage,les longues balades,l'humour,l'humanitaire... tant de choses...
Partager ce blog