pele-mele.blog4ever.com

PÊLE-MÊLE

Tuto Bordure / Tableau avec images

Tout d’abord avant de commencer je voudrai remercier quelques personnes sans qui je n’aurai pas pu faire ce tuto.

Un grand merci à Simon, Stéph@ne et Lina de Blog4ever pour leur aide ,

 

Tout ou presque tout se passe dans la page d’accueil de votre blog, simplement il y aura ou pas des petits réglages à faire dans la partie desing du blog.

 

En faite de bordures se sont des tableaux que l’ont superposent les uns sur les autres , en fonction du nombre de bordure que vous voulez obtenir il vous faudra des images ou pas car vous pouvez utiliser les couleurs de fond qui sont à votre disponibilité sur votre page d’accueil , dans l’absolu et comme je ne savais pas trop ou j’allais je suis parti sur des images qui faisaient 700px sauf une dont on m’a donné l’adresse donc je ne sais pas les dimensions.

 

IMPORTANT

 

Commencez sur votre blog essai et enregistrer vos travaux au fur et à mesure qu’ils avancent.

Pensez à bien renommer vos images pour que se soit plus facile de vous y retrouver  lors de la mise en place de vos tableaux et dans vos codes HTML

 

Pour mes bordures j’ai 3 images qui se répètent,

 

Capture.JPG
 

 pixelles.JPG

pixelles1.JPG

 

Copier et coller le code si dessous, 

Pensez à mettre l'adresse de vos images que vous aurez au préalable prise dans votre boîte à fichier.

 

N'oubliez pas non plus comme indiqué dans le précédent tuto de bien faire attention à la hauteur et aux intervalles.

Si vous avez des suggestions, des remarques, à me donner ,ou des conseilles à me demander, je resta à votre disposition .

A savoir qu'une grande partie de cette démonstration je l'ai acquise toute seule,

 que je ne suis pas une experte en code, que j'ai passé beaucoup de mon temps à cette  l'exercice alors,

Merci de votre indulgence , et merci aussi de votre diligence.

 bonne création.

pixelles.png

 

 

<table style="background-image: url(' ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 700px; height: 5400px;" align="center">

<tbody>

<tr>

 

<td style="width: 100%;">

<table style="background-image: url(' ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 680px; height: 5380px;" align="center">

<tbody>

<tr>

 

<td style="width: 100%;">

<table style="background-image: url(' ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 670px; height: 5370px;" align="center">

<tbody>

<tr>

 

<td style="width: 100%;">

<table style="background-image: url(' ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 650px; height: 5350px;" align="center">

<tbody>

<tr>

 

<td style="width: 100%;">

<table style="background-image: url('

ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 640px; height: 5340px;" align="center">

<tbody>

<tr>

 

<td style="width: 100%;">

<table style="background-image: url(' ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 610px; height: 5310px;" align="center">

<tbody>

<tr>

 

<td style="width: 100%;">

<table style="background-image: url(' ICI VOTRE IMAGE'); border-style: solid; border-width: 2px; border-color: #565756; width: 600px; height: 5300px;" align="center">

<tbody>

<tr>

 

Une fois le dernier tableaux posé

n'oubliez pas de rajouter un tableau transparent.

comme indiqué  ci dessous

16.JPG

16bis.JPG

17.JPG

18.jpg

19.jpg



24/01/2018
1 Poster un commentaire

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 14 autres membres