image image image
Introduction au développement en couche
Le déclin de l'informatique au Qc
Devenir un développeur Freelance
Introduction au développement en couche En entreprise, les logiciels les plus fréquemment développés sont des interfaces utilisateurs permettant la gestion d'un ensemble de données tel que les données clients d'une entreprise. Ils veulent pouvoir ajouter, supprimer et modifier les informations de leurs clients. Une base de données permet de stocker leur information.
  Plus ...
Le déclin de l'informatique au Qc Les années 1990 ont connu une fulgurante explosion dans tous les domaines se rapportant à l'informatique et aux nouvelles technologies. Dans ces années, on pouvait voir une quantité phénoménale d'étudiants en informatique qui cherchait à faire fortune dans un domaine en plein essor. La diversité des emplois et le nombre de postes disponibles étaient en constante augmentation.

Plus ...
Devenir un développeur Freelance Avez-vous déjà rêvé d'être un développeur web indépendant; Freelance ? Que vous travailliez pour quelqu'un ou que vous développez pour le plaisir, il y a quelques trucs et conseils que vous pouvez utiliser pour vous faciliter la vie en tant que développeur web indépendant même si vous ne le faites qu'à temps partiel.

Plus ...
Mercredi Mars 10 , 2010
TEXT_SIZE
   

Tutoriaux

Améliorer la pagination de votre blog avec CSS, un must!

Administrateur

Nov 04 |18:51
Voici aujourd'hui un petit cours de design pour vos paginations à l'aide de CSS. Depuis l'arrivée des blogs, que ce soit avec Wordpress, Dotclear, Joomla ou tout autres services en ligne tel Blogspot, les systèmes de pagination on fait une entré fracassante sur le web. En fait, ce système existait déjà bien avant, par contre, leur utilisations était beaucoup plus discrète. Voici donc aujourd'hui, une série d'exemple code inclus pour améliorer la présentation de vos paginations.

Digg Style

HTML

<div class="digg">
    <span class="disabled"> < </span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2"> > </a>
</div>

CSS

DIV.digg {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    TEXT-ALIGN: center;
}
DIV.digg A {
    BORDER-RIGHT: #aaaadd 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #aaaadd 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #aaaadd 1px solid;
    COLOR: #000099;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #aaaadd 1px solid;
    TEXT-DECORATION: none;
}
DIV.digg A:hover {
    BORDER-RIGHT: #000099 1px solid;
    BORDER-TOP: #000099 1px solid;
    BORDER-LEFT: #000099 1px solid;
    COLOR: #000;
    BORDER-BOTTOM: #000099 1px solid;
}
DIV.digg A:active {
    BORDER-RIGHT: #000099 1px solid; B
    ORDER-TOP: #000099 1px solid;
    BORDER-LEFT: #000099 1px solid;
    COLOR: #000;
    BORDER-BOTTOM: #000099 1px solid;
}
DIV.digg SPAN.current {
    BORDER-RIGHT: #000099 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #000099 1px solid;
    PADDING-LEFT: 5px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px; MARGIN: 2px;
    BORDER-LEFT: #000099 1px solid;
    COLOR: #fff;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #000099 1px solid;
    BACKGROUND-COLOR: #000099;
}
DIV.digg SPAN.disabled {
    BORDER-RIGHT: #eee 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #eee 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #eee 1px solid;
    COLOR: #ddd;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #eee 1px solid;
}

Yahoo Style

HTML

<div class="yahoo">
    <span class="disabled"> < </span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2"> > </a>
</div>

CSS

DIV.yahoo {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    TEXT-ALIGN: center;
}
DIV.yahoo A {
    BORDER-RIGHT: #fff 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #fff 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #fff 1px solid;
    COLOR: #000099;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #fff 1px solid;
    TEXT-DECORATION: underline;
}
DIV.yahoo A:hover {
    BORDER-RIGHT: #000099 1px solid;
    BORDER-TOP: #000099 1px solid;
    BORDER-LEFT: #000099 1px solid;
    COLOR: #000;
    BORDER-BOTTOM: #000099 1px solid;
}
DIV.yahoo A:active {
    BORDER-RIGHT: #000099 1px solid;
    BORDER-TOP: #000099 1px solid;
    BORDER-LEFT: #000099 1px solid;
    COLOR: #f00;
    BORDER-BOTTOM: #000099 1px solid;
}
DIV.yahoo SPAN.current {
    BORDER-RIGHT: #fff 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #fff 1px solid;
    PADDING-LEFT: 5px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #fff 1px solid;
    COLOR: #000;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #fff 1px solid;
    BACKGROUND-COLOR: #fff;
}
DIV.yahoo SPAN.disabled {
    BORDER-RIGHT: #eee 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #eee 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #eee 1px solid;
    COLOR: #ddd;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #eee 1px solid;
}

New Yahoo Style

HTML

<div class="yahoo2">
    <span class="disabled"> < Prev</span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2">Next > </a>
</div>

CSS

DIV.yahoo2 {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    FONT-SIZE: 0.85em;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    FONT-FAMILY: Tahoma,Helvetica,sans-serif;
    TEXT-ALIGN: center;
}
DIV.yahoo2 A {
    BORDER-RIGHT: #ccdbe4 1px solid;
    PADDING-RIGHT: 8px;
    BACKGROUND-POSITION: 50% bottom;
    BORDER-TOP: #ccdbe4 1px solid;
    PADDING-LEFT: 8px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #ccdbe4 1px solid;
    COLOR: #0061de;
    MARGIN-RIGHT: 3px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #ccdbe4 1px solid;
    TEXT-DECORATION: none;
}
DIV.yahoo2 A:hover {
    BORDER-RIGHT: #2b55af 1px solid;
    BORDER-TOP: #2b55af 1px solid;
    BACKGROUND-IMAGE: none;
    BORDER-LEFT: #2b55af 1px solid;
    COLOR: #fff;
    BORDER-BOTTOM: #2b55af 1px solid;
    BACKGROUND-COLOR: #3666d4;
}
DIV.yahoo2 A:active {
    BORDER-RIGHT: #2b55af 1px solid;
    BORDER-TOP: #2b55af 1px solid;
    BACKGROUND-IMAGE: none;
    BORDER-LEFT: #2b55af 1px solid;
    COLOR: #fff;
    BORDER-BOTTOM: #2b55af 1px solid;
    BACKGROUND-COLOR: #3666d4;
}
DIV.yahoo2 SPAN.current {
    PADDING-RIGHT: 6px;
    PADDING-LEFT: 6px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    COLOR: #000;
    MARGIN-RIGHT: 3px;
    PADDING-TOP: 2px;
}
DIV.yahoo2 SPAN.disabled {
    DISPLAY: none;
}
DIV.yahoo2 A.next {
    BORDER-RIGHT: #ccdbe4 2px solid;
    BORDER-TOP: #ccdbe4 2px solid;
    MARGIN: 0px 0px 0px 10px;
    BORDER-LEFT: #ccdbe4 2px solid;
    BORDER-BOTTOM: #ccdbe4 2px solid;
}
DIV.yahoo2 A.next:hover {
    BORDER-RIGHT: #2b55af 2px solid;
    BORDER-TOP: #2b55af 2px solid;
    BORDER-LEFT: #2b55af 2px solid;
    BORDER-BOTTOM: #2b55af 2px solid;
}
DIV.yahoo2 A.prev {
    BORDER-RIGHT: #ccdbe4 2px solid;
    BORDER-TOP: #ccdbe4 2px solid;
    MARGIN: 0px 10px 0px 0px;
    BORDER-LEFT: #ccdbe4 2px solid;
    BORDER-BOTTOM: #ccdbe4 2px solid;
}
DIV.yahoo2 A.prev:hover {
    BORDER-RIGHT: #2b55af 2px solid;
    BORDER-TOP: #2b55af 2px solid;
    BORDER-LEFT: #2b55af 2px solid;
    BORDER-BOTTOM: #2b55af 2px solid;
}

Flickr Style

HTML

<div class="flickr">
    <span class="disabled"> < </span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2"> > </a>
</div>

CSS

DIV.flickr {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    TEXT-ALIGN: center;
}
DIV.flickr A {
    BORDER-RIGHT: #dedfde 1px solid;
    PADDING-RIGHT: 6px;
    BACKGROUND-POSITION: 50% bottom;
    BORDER-TOP: #dedfde 1px solid;
    PADDING-LEFT: 6px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #dedfde 1px solid;
    COLOR: #0061de;
    MARGIN-RIGHT: 3px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #dedfde 1px solid;
    TEXT-DECORATION: none;
}
DIV.flickr A:hover {
    BORDER-RIGHT: #000 1px solid;
    BORDER-TOP: #000 1px solid;
    BACKGROUND-IMAGE: none;
    BORDER-LEFT: #000 1px solid;
    COLOR: #fff;
    BORDER-BOTTOM: #000 1px solid;
    BACKGROUND-COLOR: #0061de;
}
DIV.meneame A:active {
    BORDER-RIGHT: #000 1px solid;
    BORDER-TOP: #000 1px solid;
    BACKGROUND-IMAGE: none;
    BORDER-LEFT: #000 1px solid;
    COLOR: #fff;
    BORDER-BOTTOM: #000 1px solid;
    BACKGROUND-COLOR: #0061de;
}
DIV.flickr SPAN.current {
    PADDING-RIGHT: 6px;
    PADDING-LEFT: 6px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    COLOR: #ff0084;
    MARGIN-RIGHT: 3px;
    PADDING-TOP: 2px;
}
DIV.flickr SPAN.disabled {
    PADDING-RIGHT: 6px;
    PADDING-LEFT: 6px;
    PADDING-BOTTOM: 2px;
    COLOR: #adaaad;
    MARGIN-RIGHT: 3px;
    PADDING-TOP: 2px;
}

Sabros.us Style

HTML

<div class="sabrosus">
    <span class="disabled"> < </span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2"> > </a>
</div>

CSS

DIV.sabrosus {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    TEXT-ALIGN: center;
}
DIV.sabrosus A {
    BORDER-RIGHT: #9aafe5 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #9aafe5 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #9aafe5 1px solid;
    COLOR: #2e6ab1;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #9aafe5 1px solid;
    TEXT-DECORATION: none;
}
DIV.sabrosus A:hover {
    BORDER-RIGHT: #2b66a5 1px solid;
    BORDER-TOP: #2b66a5 1px solid;
    BORDER-LEFT: #2b66a5 1px solid;
    COLOR: #000;
    BORDER-BOTTOM: #2b66a5 1px solid;
    BACKGROUND-COLOR: lightyellow;
}
DIV.pagination A:active {
    BORDER-RIGHT: #2b66a5 1px solid;
    BORDER-TOP: #2b66a5 1px solid;
    BORDER-LEFT: #2b66a5 1px solid;
    COLOR: #000;
    BORDER-BOTTOM: #2b66a5 1px solid;
    BACKGROUND-COLOR: lightyellow;
}
DIV.sabrosus SPAN.current {
    BORDER-RIGHT: navy 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: navy 1px solid;
    PADDING-LEFT: 5px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: navy 1px solid; COLOR: #fff;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: navy 1px solid;
    BACKGROUND-COLOR: #2e6ab1;
}
DIV.sabrosus SPAN.disabled {
    BORDER-RIGHT: #929292 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #929292 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #929292 1px solid;
    COLOR: #929292;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #929292 1px solid;
}

Black-Red Style

HTML

<div style="padding-top:10px;padding-bottom:10px;background-color:#313131;">
    <div class="black-red">
        <span class="disabled"> < </span>
        <span class="current">1</span>
        <a href="#?page=2">2</a>
        <a href="#?page=3">3</a>
        <a href="#?page=4">4</a>
        <a href="#?page=5">5</a>
        <a href="#?page=6">6</a>
        <a href="#?page=7">7</a>...
        <a href="#?page=199">199</a>
        <a href="#?page=200">200</a>
        <a href="#?page=2"> > </a>
    </div>
</div>

CSS

DIV.black-red {
    FONT-SIZE: 11px;
    COLOR: #fff;
    FONT-FAMILY: Tahoma, Arial, Helvetica, Sans-serif;
    BACKGROUND-COLOR: #3e3e3e;
}
DIV.black-red A {
    PADDING-RIGHT: 5px;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    COLOR: #fff;
    PADDING-TOP: 2px;
    BACKGROUND-COLOR: #3e3e3e;
    TEXT-DECORATION: none;
}
DIV.black-red A:hover {
    COLOR: #fff;
    BACKGROUND-COLOR: #ec5210;
}
DIV.black-red A:active {
    COLOR: #fff;
    BACKGROUND-COLOR: #ec5210;
}
DIV.black-red SPAN.current {
    PADDING-RIGHT: 5px;
    PADDING-LEFT: 5px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    COLOR: #fff;
    PADDING-TOP: 2px;
    BACKGROUND-COLOR: #313131;
}
DIV.black-red SPAN.disabled {
    PADDING-RIGHT: 5px;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    COLOR: #868686;
    PADDING-TOP: 2px;
    BACKGROUND-COLOR: #3e3e3e;
}

Blue Style

HTML

<div class="manu">
    <span class="disabled"> < Prev</span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2">Next > </a>
</div>

CSS

.manu {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    TEXT-ALIGN: center;
}
.manu A {
    BORDER-RIGHT: #eee 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #eee 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #eee 1px solid;
    COLOR: #036cb4;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #eee 1px solid;
    TEXT-DECORATION: none;
}
.manu A:hover {
    BORDER-RIGHT: #999 1px solid;
    BORDER-TOP: #999 1px solid;
    BORDER-LEFT: #999 1px solid;
    COLOR: #666;
    BORDER-BOTTOM: #999 1px solid;
}
.manu A:active {
    BORDER-RIGHT: #999 1px solid;
    BORDER-TOP: #999 1px solid;
    BORDER-LEFT: #999 1px solid: #666;
    BORDER-BOTTOM: #999 1px solid;
}
.manu .current {
    BORDER-RIGHT: #036cb4 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #036cb4 1px solid;
    PADDING-LEFT: 5px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #036cb4 1px solid;
    COLOR: #fff;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #036cb4 1px solid;
    BACKGROUND-COLOR: #036cb4;
}
.manu .disabled {
    BORDER-RIGHT: #eee 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #eee 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    MARGIN: 2px;
    BORDER-LEFT: #eee 1px solid;
    COLOR: #ddd;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #eee 1px solid;
}

Gray Style

HTML

<div class="quotes">
    <span class="disabled"> < </span>
    <span class="current">1</span>
    <a href="#?page=2">2</a>
    <a href="#?page=3">3</a>
    <a href="#?page=4">4</a>
    <a href="#?page=5">5</a>
    <a href="#?page=6">6</a>
    <a href="#?page=7">7</a>...
    <a href="#?page=199">199</a>
    <a href="#?page=200">200</a>
    <a href="#?page=2"> > </a>
</div>

CSS

DIV.quotes {
    PADDING-RIGHT: 3px;
    PADDING-LEFT: 3px;
    PADDING-BOTTOM: 3px;
    MARGIN: 3px;
    PADDING-TOP: 3px;
    TEXT-ALIGN: center;
}
DIV.quotes A {
    BORDER-RIGHT: #ddd 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #ddd 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #ddd 1px solid;
    COLOR: #aaa;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #ddd 1px solid;
    TEXT-DECORATION: none;
}
DIV.quotes A:hover {
    BORDER-RIGHT: #a0a0a0 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #a0a0a0 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #a0a0a0 1px solid;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #a0a0a0 1px solid;
}
DIV.quotes A:active {
    BORDER-RIGHT: #a0a0a0 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #a0a0a0 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #a0a0a0 1px solid;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #a0a0a0 1px solid;
}
DIV.quotes SPAN.current {
    BORDER-RIGHT: #e0e0e0 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #e0e0e0 1px solid;
    PADDING-LEFT: 5px;
    FONT-WEIGHT: bold;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #e0e0e0 1px solid;
    COLOR: #aaa;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #e0e0e0 1px solid;
    BACKGROUND-COLOR: #f0f0f0;
}
DIV.quotes SPAN.disabled {
    BORDER-RIGHT: #f3f3f3 1px solid;
    PADDING-RIGHT: 5px;
    BORDER-TOP: #f3f3f3 1px solid;
    PADDING-LEFT: 5px;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #f3f3f3 1px solid;
    COLOR: #ccc;
    MARGIN-RIGHT: 2px;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #f3f3f3 1px solid;
}

Commentaires (1)Add Comment
feedFlux RSS pour les commentaires
Page de navigation
Par Prince Turk , juin 13, 2009
je voudrais mettre sur mon blogger tu peux m'aider stp

Ecrivez un commentaire
Réduire l'éditeur | Agrandir l'éditeur

busy

Navigation

Réseaux sociaux

Add this page to Blinklist Add this page to Del.icoi.us Add this page to Digg Add this page to Facebook Add this page to Furl Add this page to Google Add this page to Ma.Gnolia Add this page to Newsvine Add this page to Reddit Add this page to StumbleUpon Add this page to Technorati Add this page to Yahoo

Connexion

Publicités

MeilleursPrix.ca

Services offerts

image

Développement Web

Que ce soit pour faire la conception d'un site Web ou pour la refonte d'un site existant, nous avons la solution.

La création et la conception Web sont au cœur de nos activités. Chaque concept et création sont différents, et chaque client est unique. Rien n’est laissé au hasard pour faire de votre création multimédia un outil unique de promotion.

Plus
image

Développement Windows

Quel que soit votre projet, nous pouvons le réaliser pour vous !

Grâce à notre expertise en programmation, nous sommes en mesure de concevoir une variété d’applications qui pourront vous permettre d’augmenter votre clientèle, de la fidéliser ou encore de réduire vos coûts d’opération ! Nos critères élevés de contrôle de qualité ainsi que la grande expertise de nos programmeurs et de nos chargés de projets contribuent au succès des mandats qui nous sont confiés.

Plus
image

Base de données

...
Plus
image

Autres

Quel que soit vos projets ou vos idées, contactez nous!

Grâce à notre expérience et notre expertise en informatique, nous serons en mesure d'évaluer vos projets et nous pourrons trouver une solution à vos problèmes. Que ce soit de la programmation ou de la base de données ou bien tout autres problèmes informatiques, contactez nous, nous serons là pour vous.

Plus