comment coder ces images en site web ?

Question

BOnjour, 

J'aimerais me créer une page perso de se style la : www.joffreylacour.fr

la personne qui a créer ce site à utilisé une image de fond : 

[url=https://pix.toile-libre.org/?img=1254952140.jpg][img]https://pix.toile-libre.org/upload/img/1254952140.jpg[/img][/url]


et pour recréer les effet de passage sur "contact ; my blog ; twitter ; facebook "  , cette images la : 


[url=https://pix.toile-libre.org/?img=1254952203.png][img]https://pix.toile-libre.org/upload/img/1254952203.png[/img][/url]





voila, sinon voici son fichier style.css :

/*
Theme Name: Joffrey Lacour
Theme URI: http://joffreylacour.fr/
Description: Original theme for joffreylacour.fr
Version: 4.0
Author: Joffrey Lacour
*/


/* CSS Document */
@charset "utf-8";


/* CSS Reset */

* {
	margin: 0;
	padding: 0;
	outline: none;
}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { 
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset, img { 
	border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}

ol, ul {
	list-style: none;
}

caption, th {
	text-align: left;
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}

q:before, q:after {
	content: '';
}

abbr, acronym {
	border: 0;
}


/* Hacks */

input:focus {
	outline: 0;
}


/* Main CSS */

body {
	background: #000 url(../img/background.jpg) no-repeat scroll 0 0;
	color: #fff;
	font-family: Helvetica, Arial, sans-serif;
}

em {
	font-style: italic;
}

strong {
	font-weight: bold;
}

acronym {
	font-style: italic;
}

.left {
	float: left;
}

.right {
	float: right;
}

.clear {
	clear: both;
}

.amp {
	font-family: Palatino, Baskerville, Georgia, "Times New Roman", serif;
	font-style: italic;
}



h1, h2 {
	text-indent: -9999px;
}


ul {
	position: absolute;
	top: 350px;
	left: 90px;
	height: 200px;
}

ul li {
	display: inline;
	float: left;
	margin-right: 40px;
}

ul li a {
	text-indent: -9999px;
	display: block;
}



ul li#link-contact a {
	background: transparent url(../img/buttons.png) no-repeat 0 0;
	width: 104px;
	height: 20px;
}

ul li#link-contact a:hover {
	background: transparent url(../img/buttons.png) no-repeat 0 -25px;
}

ul li#link-blog a {
	background: transparent url(../img/buttons.png) no-repeat -142px 0;
	width: 114px;
	height: 24px;
}

ul li#link-blog a:hover {
	background: transparent url(../img/buttons.png) no-repeat -142px -25px;
}

ul li#link-twitter a {
	background: transparent url(../img/buttons.png) no-repeat -294px 0;
	width: 98px;
	height: 20px;
}

ul li#link-twitter a:hover {
	background: transparent url(../img/buttons.png) no-repeat -294px -25px;
}

ul li#link-facebook a {
	background: transparent url(../img/buttons.png) no-repeat -431px 0;
	width: 128px;
	height: 20px;
}

ul li#link-facebook a:hover {
	background: transparent url(../img/buttons.png) no-repeat -431px -25px;
}




.error {
	margin: 200px auto;
	text-align: center;
}

.error h2 {
	font-size: 76px;
	font-weight: bold;
}





Voila , si vous savez simplement comment "coder" ces 2 images ainsi que créer des liens sur les mots "contact ; my blog ; twitter ; facebook" 

sa serait simpa ;)


d'avance merci

Utilisateur anonyme · Answer

Si tu as le CSS alors tu peux prendre également le code de la page (Code source) et tu auras tout ce qu'il te faut...

Utilisateur anonyme · Answer

ok.


Peut me dire comment je dois organiser tout sa ? 

Le code source j'en fait quoi ? 

le fichier styte.css ?

Le bon point est que je dispose de tout les fichiers nécéssaires.


peux tu m'indiquer la méthode pour assembler tout cela ?

Merci

Utilisateur anonyme · Answer

Ce que je veux dire c'est que la page doit être constitué d'une page HTML et d'une CSS. Disposant des deux, tu as le contenu de la page j'imagine. Regarde le code HTML et comment le créateur (qui doit t'autoriser à le copier car tu as sa page CSS) a fait. Après je sais pas le code exact pour le faire donc je peux pas t'en dire plus, jusqu'en fouinant tu devrais trouver la réponse (vive la programmation ! C'est drôle de fouiner je trouve!)
Bonne chance et si tu n'y arrives pas, un pro devrait pouvoir t'aider ou des tutoriaux disponibles sur internet..

Utilisateur anonyme · Answer

je n'est pas trop compris.

La je dispose du fichier style.css

Les images nécéssaires

le code source (je l'ai obtenu en faisant clique droit sur la page , puis code source)

Voila maintenant je veux savoir comment assembler tout cela pour que le site soit visible.

Merci.




ps: je tiens a présiser que je ne veux pas recréer se site, mais juste connaitre la technique utilisé.

Utilisateur anonyme · Answer

Généralement tu mets les deux pages dans un même dossier. Mais si tu veux reconstituer le site alors il te faudrait avoir toutes les photos enregistrées au même nom que le créateur du site, avoir les mêmes noms de dossiers... et supposer qu'il a pas fait une page java ou php ou autre qui te manquerait. C'est un travail assez compliqué en bref. Je te conseille juste de repérer les images en question et de voir le code associé et regarder s'il marche..

Utilisateur anonyme · Answer

d'accord...

Sinon, il faudrait que quelqu'un m'explique comment coder ce que je veux ( comme ce site : joffreylacour.fr) 
avec un backround, et quelques liens/images


Voila. Merci

Utilisateur anonyme · Answer

C'est beaucoup plus drôle de fouiner et tu auras plus de mérite (et encore) si tu cherches par toi même plutôt que d'attendre la réponse toute faite. Mais bon tu fais ce que tu veux.

Bonne fin de soirée et bonne attente de réponse ...

Utilisateur anonyme · Answer

et bien je cherche, mais je ne trouve pas ^^


Merci encore ;)

Comment coder ces images en site web ?

8 réponses

Votre réponse

Discussions similaires

Newsletters