Les derniers articles :

Comparer deux fichiers dans Sublime Text

Sublime_Text

La création d’un site internet passe par la création, l’édition et la correction de nombreux fichiers. Il est souhaitable de toujours mettre en place un système de versioning (version de fichier). Cette bonne pratique de développement nous permet de revenir sur d’anciennes version de fichier et de les comparer avec ceux en ligne.

Lire la suite

Feuilles types HTML5 + CSS3

Une feuille HTML5 type :

XHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<title>Page HTML5</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
</head>
<body>
<header></header>
 
<nav></nav>
 
<section>
<article></article>
<aside></aside>
</section>
 
<footer></footer>
</body>
</html>

 Une feuille CSS3 type avec @media query :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
/* MOBILE PORTRAIT */
@media only screen and (min-width: 320px) {
}
 
/* MOBILE LANDSCAPE */
@media only screen and (min-width: 480px) {
}
 
/* SMALL TABLET */
@media only screen and (min-width: 600px) {
}
 
/* TABLET/NETBOOK */
@media only screen and (min-width: 768px) {
}
 
/* LANDSCAPE TABLET/NETBOOK/LAPTOP */
@media only screen and (min-width: 1024px) {
}
 
/* LAPTOP Medium resolution*/
@media only screen and (min-width: 1280px) {
}
 
/* LAPTOP Hight resolution */
@media only screen and (min-width: 1400px) {
}
 
/* PRINT */
@media print {
}

 

Diminuer la luminosité au passage de la souris sur une image

Le filtre britghtness est une propriété introduite par le CSS3. Il faut donc appliquer le CSS correspondant pour chaque navigateurs.

CSS
1
2
3
4
5
6
7
img:hover {
filter: brightness(50%);
-webkit-filter: brightness(50%);
-moz-filter: brightness(50%);
-o-filter: brightness(50%);
-ms-filter: brightness(50%);
}

 

Charger des fonctions depuis un autre fichier en js

JavaScript
1
2
3
4
5
function max_color(color){
$('body').css("background-color", color);
}
 
window.max_color = max_color ;

// Permet a la fonction d’etre accessible depuis n’importe quelle fichier js charger par votre page web.

Appliquer un style CSS uniquement sur Internet Explorer 9

Pour une valeur négative:

CSS
1
2
3
.header{
top: ~'-60px\9\0';
}

Pour une valeur positive :

CSS
1
2
3
.header{
top: 60px\9\0;
}

! Fonctionne à conditions de placer le hack en dessous de votre code css.

Supprimer le cache de Widgetkit sous wordpress

wordpress

Lorsque que l’on intègre ou que développe un site internet, il peut arriver que le cache vous joue des tours. Sur WordPress, la Bibliothèque de Médias n’actualise pas toujours bien les images remplacées; surtout si elle porte le même nom.

Lire la suite

Supprimer la Barre d’administration de WordPress

wpadminbar

Lorsque l’on crée un template sous WordPress, il arrive que la barre d’administration (wpadminbar) représente une gêne pour le placement de certains éléments graphiques. Il existes des shortcode CSS ou PHP toutefois nous préférons utiliser les outils fournis par l’administration de WordPress.

Lire la suite

Appliquer un style CSS uniquement sur Safari

1
2
3
4
5
@media screen and (-webkit-min-device-pixel-ratio:0) {
::i-block-chrome, .maclasse {
margin-left: 30%;
}
}

! Fonctionne à conditions de placer le hack en dessous de votre code css.

Ignorer la première balise d’une liste en CSS

Nous souhaitons ignorer le premier élément d’une liste et mettre tout les autres en rouge.

HTML :

XHTML
1
2
3
4
5
<ul>
<li>Élément de liste 1</li>
<li>Élément de liste 2</li>
<li>Élément de liste 3</li>
</ul>

CSS :

CSS
1
2
3
ul li + li {
color: #FF9900;
}

 Résultat :

  • ¤ Élément de liste 1
    ¤ Élément de liste 2
    ¤ Élément de liste 3

Se connecter a un VOIP depuis l’Algérie

Certaines personnes Algériennes ont du remarquer qu’il leur est impossible de se connecter à certains VOIP du genre: Teamspeak, Skype ou Mumble. Cet article est fait pour vous offrir une solution.

Lire la suite

1 … 7 8 9 10 11 12  
Réalisé par M.Defachelle.