07.07.16 15:54
LOVELY!BONES
voici le modèle instagram entièrement de
zadig que nous remercions.
Nom d'utilisateur
Pseudo, nom, whatever Hello my name is Robert
###
posts
###
followers
###
following
Code: <link href='http://fonts.googleapis.com/css?family=Grand+Hotel' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'><link href='http://zadigandwind.fr/css/other/instagram_mockup.css' rel='stylesheet' type='text/css'><!-- --> <style type='text/css'>.photo{width: 100px; height: 100px; padding:5px; margin: 5px;} .photo-inside{width: 100px; height:100px; background-color: rgba(0, 0, 0, 0.1); background-size:100px;position: relative;left: -1px;top: -1px;}.instapost {width: 480px; background: none repeat scroll 0% 0% #F8F8F8; padding: 5px; border-radius: 5px; margin-bottom: 5px;}</style><center> <div class="insta-fond"><!-- ---- Début de la barre Instagram ---- --> <div class="insta-barre"><!-- --> <table cellpadding="0" cellspacing="0"><tr><td><div style="position: relative; left:-130px;"><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div></td><td><div style="background-color:rgba(6, 54, 95, 0.35); height:30px;"><a href="http://www.bazzart.org/u4334"> <div class="insta-home"> </div></a> </div></td><td><div class="insta-separator"></div></td></tr></table></div></td><td><div class="logo"> Instagram </div> </td><td><div style="position: relative; right:-127px;"> <!-- --><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div> </td><td> <!-- --><div style="margin-left:8px; margin-right:3px;"><!-- Début mini icone utilisateur --> <div class="mini-icon-profile" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"></div><!-- Fin icone utilisateur et début Username --></div> </td><td><div class="insta-miniusername">Votre Username ici</div><!-- ----- Fin Username ----- --></td><td><div class="insta-separator"></div></td></tr></table></div></td></tr></table> </div><!-- ---- FIN de la barre Instagram ---- --><div class="insta-feed-header" style=""><!-- ---------- Début du header contenant les icones -------------------- --> <div class="insta-icon-container"> <table cellpadding="0" cellspacing="0"><tr><td><!-- ----- IMAGE 1 ----- --><!-- IMAGE 1.a--><div id="instaimg1" style="background-image: url(http://nsa19.casimages.com/img/2010/12/26/mini_101226043820955674.png);"> <!-- IMAGE 1.b --><div class="instahover1" style="background-image: url(http://24.media.tumblr.com/215942492d447a6b0c602247e22cca00/tumblr_mrxe3mLIKL1rdbsfyo1_1280.png);"></div></div><!-- ---- IMAGE 2 ---- --> <!-- IMAGE 2.a --> <div id="instaimg2" style="background-image: url(http://img4.hostingpics.net/pics/437360NicoIc3.png);"> <!-- IMAGE 2.b --><div class="instahover2" style="background-image: url(http://img11.hostingpics.net/pics/298906NicoIc2.png);"></div></div></td><td><!-- ----- IMAGE 3 (grande pic) ----- --><!-- IMAGE 3.a --><div id="instaimg" style="background-image: url(http://24.media.tumblr.com/262ead445d2cfb2380a283c8b4781ede/tumblr_mwlpan8Luq1qd9433o1_1280.jpg);"><!-- IMAGE 3.b --><div class="instahover" style="background-image: url(http://24.media.tumblr.com/831be3867bddc0e13f39400fa930e704/tumblr_msbey1hEOV1qa9vqgo1_500.png);"></div></div></td><td><!-- ------ IMAGE 4 ------ --><!-- IMAGE 4.a --><div id="instaimg3" style="background-image: url(http://img4.hostingpics.net/pics/818362NicoIc4.png);"><!-- IMAGE 4.b --><div class="instahover3" style="background-image: url(http://24.media.tumblr.com/c6d3e5c713f4c7485d7f8f85de9fd06d/tumblr_my8uldAvSB1s88sudo2_500.png);"></div></div> <!-- ------ IMAGE 5 ------ --><!-- IMAGE 5.a --><div id="instaimg4" style="background-image: url(http://nimga.fr/m/OiQQJ.jpg);"><!-- IMAGE 5.b --><div class="instahover4" style="background-image: url(http://31.media.tumblr.com/82de075b23853c1cf794ede07ef33d62/tumblr_my8uldAvSB1s88sudo4_500.png);"></div></div></td> <td><!-- ------ IMAGE 6 ------ --><!-- IMAGE 6.a --><div id="instaimg5" style="background-image: url(http://static.tumblr.com/8f4662f79afc407bf14139ef1bf49560/r2lnqa3/xxlmjhbso/tumblr_static_profile.png);"><!-- IMAGE 6.b --><div class="instahover5" style="background-image: url(http://25.media.tumblr.com/3bd0c5ef67e856bfe50a06688e98275f/tumblr_n0rlhfT74y1r3owo1o3_250.gif);"></div></div><!-- ------ IMAGE 7 ------ --><!-- IMAGE 7.a --> <div id="instaimg6" style="background-image: url(http://24.media.tumblr.com/5f0bf1a295449dbf470b5d7f1472e986/tumblr_my8uldAvSB1s88sudo1_500.png);"><!-- ------ IMAGE 7 ------ --><!-- IMAGE 7.b --><div class="instahover6" style="background-image: url(http://24.media.tumblr.com/215942492d447a6b0c602247e22cca00/tumblr_mrxe3mLIKL1rdbsfyo1_1280.png);"></div></div></td></tr></table> </div></div><!-- ---------- FIN du header contenant les icones -------------------- --> <div class="insta-fond-profile"><table cellpadding="0" cellspacing="0"><tr><td><div class="icon-profile-wrap"> <!-- ---------- Icone du profil (la même que la mini) -------------------- --><div class="icon-profile" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"><!-- --></div><div style="height:4px;"></div><div class="insta-button-follow"> <div class="insta-follow-text"> Following</div></div></div></td><td><!-- ------------ DEBUT DU PROFIL ------------------ --><div class="insta-username2">Nom d'utilisateur </div><!-- --><div class="bio-user"> <b>Pseudo, nom, whatever</b> Hello my name is Robert </div></td><td> <!-- ------------ DEBUT DES STATS ------------------ --><div class="insta-stat"><center><!-- ------------ Nombre de posts ------------------ --><table cellpadding="0" cellspacing="0"><tr> <td> <div class="stat-a">###</div> <div class="stat-b"> posts </div></td> <!-- ------------ Nombre de followers ------------------ --><td> <div class="stat-separator"></div></td><td><div class="stat-a">###</div><div class="stat-b"> followers </div></td><!-- ------------ Nombre de compte suivis ------------------ --><td><div class="stat-separator"></div></td><td><div class="stat-a">###</div><div class="stat-b"> following </div></td></tr></table></center></div></td></tr></table></div><!-- ------------ FIN DU PROFIL ------------------ --> <!-- ------------ DEBUT DU FEED PHOTOS ------------------ --><div class="feed-photos"><table cellpadding="0" cellspacing="0" class="feed-photo-container"><tr><!-- --> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> </tr> </table><!-- --><div class="feed-divider"></div><!-- --> <table cellpadding="0" cellspacing="0" class="feed-photo-container"><tr><!-- --><td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://24.media.tumblr.com/c6d3e5c713f4c7485d7f8f85de9fd06d/tumblr_my8uldAvSB1s88sudo2_500.png);"> </div></div></td> <!-- --><td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> <td> <div class="photo"> <div class="photo-inside" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"> </div></div></td><!-- --> </tr> </table> <!-- Coller le code avant le <!-- précédent pour rajouter des lignes. --></div><div class="load-footer">Load more...</div></div> </center>
Dernière édition par LOVELY!BONES le 12.07.16 18:17, édité 5 fois
11.07.16 20:35
LOVELY!BONES
**Nouveau post (avec commentaires)
Votre pseudo # days ago
Following
Ta vie, tes tags #Jambon !
Saucisse au jambon and 125 others like this.
Code: <div class="bigtitre1">Nouveau post (avec commentaires)</div> <center><!-- ---- Début de la barre Instagram ---- --> <div class="insta-barre" style="left:0px;"><!-- --> <table cellpadding="0" cellspacing="0"><tr><td><div style="position: relative; left:-130px;"><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div></td><td><div style="background-color:rgba(6, 54, 95, 0.35); height:30px;"><a href="http://www.bazzart.org/u4334"> <div class="insta-home"> </div></a> </div></td><td><div class="insta-separator"></div></td></tr></table></div></td><td><div class="logo"> Instagram </div> </td><td><div style="position: relative; right:-127px;"> <!-- --><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div> </td><td> <!-- --><div style="margin-left:8px; margin-right:3px;"><!-- Début mini icone utilisateur --> <div class="mini-icon-profile" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"></div><!-- Fin icone utilisateur et début Username --></div> </td><td><div class="insta-miniusername">Votre Username ici</div><!-- ----- Fin Username ----- --></td><td><div class="insta-separator"></div></td></tr></table></div></td></tr></table> </div><!-- ---- FIN de la barre Instagram ---- --><div class="insta-fond" style="padding-top:5px;"><div class="instapost"><table cellpadding=0 cellspacing=0 cellmargin=0 width=100%><tr valign="middle"><td width="230px" style="border-right: 1px solid #AAA; padding: 3px;"><a href="http://www.bazzart.org/u4334"><!-- --><div class="insta-post-left"> <!-- Votre image de post --><div class="insta-post-left-img" style="background:url(http://24.media.tumblr.com/831be3867bddc0e13f39400fa930e704/tumblr_msbey1hEOV1qa9vqgo1_500.png)"></div></div></a><!-- --></td><td><!-- --><div style="background: #fefefe;"><div class="profile-bar"><table width="100%"><tr valign="top"><!-- Mini-image de profil --><td width="30px"><div class="insta-comment-img" style="background:url(http://24.media.tumblr.com/215942492d447a6b0c602247e22cca00/tumblr_mrxe3mLIKL1rdbsfyo1_1280.png)"></div></td><td><!-- --><div class="insta-poster">Votre pseudo <!-- --><b># days ago</b> </div></td><!-- --><td width="60px"><div class="insta-button-follow" style="margin-top: 0px"><span class="insta-follow-text">Following</span></div></td></tr><!-- --><tr><td colspan="2"><div class="instacap"> Ta vie, tes tags #Jambon ! </div> </td></tr></table></div> <!-- La Like bar. Si t'as pas de likes, bah tu mets 0 *pan* --><div class="likesBar"> <span class="likesBar-pseudo">Saucisse au jambon</span> and <span class="likesBar-number">125</span> others like this. </div><!-- Les champs des commentaires --> <div class="insta-comment"><!-- --> <div style="icomm"> <div class="insta-comment-img" style="background:url(http://24.media.tumblr.com/215942492d447a6b0c602247e22cca00/tumblr_mrxe3mLIKL1rdbsfyo1_1280.png)"></div> <b>un pseudo</b><br/> un commentaire. <i>#tag</i> <a href="" class="insta-link">@Link</a></div><br/> <!-- --><div style="icomm"> <div class="insta-comment-img" style="background:url(http://24.media.tumblr.com/215942492d447a6b0c602247e22cca00/tumblr_mrxe3mLIKL1rdbsfyo1_1280.png)"></div> <b>un pseudo</b> <br/> un commentaire.</div><br/></div> <div style="background: #fefefe; padding: 0px 0px"><img src="http://image.noelshack.com/fichiers/2014/13/1395771220-0nwsiwm2.png"/></div></div><!-- --></td></tr></table> </div></div></center>
**Commenter
un pseudo Commentaire pas trop long sinon ça devient grave moche
Code: <div class="bigtitre1">Commenter</div> <center><!-- ---- Début de la barre Instagram ---- --> <div class="insta-barre" style="left:0px;"><!-- --> <table cellpadding="0" cellspacing="0"><tr><td><div style="position: relative; left:-130px;"><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div></td><td><div style="background-color:rgba(6, 54, 95, 0.35); height:30px;"><a href="http://www.bazzart.org/u4334"> <div class="insta-home"> </div></a> </div></td><td><div class="insta-separator"></div></td></tr></table></div></td><td><div class="logo"> Instagram </div> </td><td><div style="position: relative; right:-127px;"> <!-- --><table cellpadding="0" cellspacing="0"><tr><td><div class="insta-separator"></div> </td><td> <!-- --><div style="margin-left:8px; margin-right:3px;"><!-- Début mini icone utilisateur --> <div class="mini-icon-profile" style="background-image: url(http://25.media.tumblr.com/7e190140bda31457ebabe32bc98118c5/tumblr_n12xsedB8Q1sn52zko1_500.jpg);"></div><!-- Fin icone utilisateur et début Username --></div> </td><td><div class="insta-miniusername">Votre Username ici</div><!-- ----- Fin Username ----- --></td><td><div class="insta-separator"></div></td></tr></table></div></td></tr></table> </div><!-- ---- FIN de la barre Instagram ---- --><div class="insta-fond" style="padding-top:2px;"><div class="insta-reply-wrap"><div class="insta-reply-img" style="background:url(http://24.media.tumblr.com/215942492d447a6b0c602247e22cca00/tumblr_mrxe3mLIKL1rdbsfyo1_1280.png)"></div> <span class="reply-pseudo">un pseudo</span> Commentaire pas trop long sinon ça devient grave moche </div></div></center>
code de zadig , merci à elle.
un commentaire. #tag @Link
un commentaire.