Bienvenue à Blogs CodeS-SourceS Identification | Inscription | Aide

Atteint de JavaScriptite Aiguë [Cyril Durand]

Expert ASP.net Ajax et WCF, Cyril Durand parle dans son blog de point techniques sur ASP.net, ASP.net Ajax, JavaScript, WCF et .net en général. Cyril est également consultant indépendant, n'hésitez pas à le contacter pour de l'assistance sur vos projets

Actualités

  • Blog de Cyril DURAND, passionné de JavaScript, Ajax, ASP.net et tout ce qui touche au developpement Web Client-Side.

    N'hésitez pas à me contacter pour vos projets .net : architecture, accompagnement, formation, ...

    View Cyril Durand's profile on LinkedIn
    hit counters


    Expertise Commerce server et BizTalk

Connaissez vous bien CSS ?

Afin de tester le Compresseur de CSS  de Poppyto j'ai fait  une règle bien sympathique :)

div[class~=A][class="A B"] + div[class=B] div[lang|=fr]:first-child > a[href^="http://"]:before
{
  content: "l'adresse est " attr(href) " " url(http://www.codes-sources.com/gfx/logos/logocs.gif) " \2713 ";
  color:#248;
  text-decoration:none;
}

Pour tester votre niveau de CSS, je lance un mini-concours (y'a rien à gagner) :

Lequel de vous est capable de m'expliquer ce selecteur ?

PS : Renaud, Azra, vous qui vous êtes beaucoup amélioré en CSS (le contraire était de toute facon impossible), y arriverez vous ?

Posted: mercredi 14 décembre 2005 01:15 par cyril
Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :

Commentaires

Poppyto a dit :

Même si je reconnais des trucs, je sèche !
Sniff ;'(
# décembre 14, 2005 01:49

Aurelien a dit :

Allez, je vous aide un peu, pour comprendre cette règle, il faut chercher un poil dans le draft de la proposition CSS 3.0
# décembre 14, 2005 09:33

cyril a dit :

Ah vi j'avais pas vou qu'il y avait un tout petit peu de CSS3 :/

mais tout le reste c'est du CSS2.1
# décembre 14, 2005 09:43

themit a dit :

C'est ou qu'on clique ?

moi je suis perdu sans ma souris :D

PS : MDR pour la remarque
# décembre 14, 2005 18:30

Country a dit :

div[class~=A][class="A B"]

L'élément div soit utiliser la classe A (les nom des classes utilisées dont séparées par des espaces) et la valeur de class doit être exactement égale à "A B" (utilisation des classes A et B), le 1er sélecteur n'est donc pas nécessaire.

+ div[class=B]

L'élément suivant doit être un élément div de class B

div[lang|=fr]:first-child

Son 1er enfant doit être un élément div dont la première valeur de lang est fr (les valeurs de l'attribut lang sont séparées par des tirets).

> a[href^="http://"]:before

Le style insérera un élément de contenu devant tous les éléments de type a placés directement sous le div et dont l'attribut href commence par "http://" (CSS3)

Le style :

content: "l'adresse est " attr(href) " " url(http://www.codes-sources.com/gfx/logos/logocs.gif) " \2713 ";

Affiche le texte "l'adresse est " suivit de la valeur le l'attribut href du lien. Affiche ensuite l'image indiquée par l'url, puis le caractère Check Mark (http://www.fileformat.info/info/unicode/char/2713/index.htm)

color:#248;

Applique la couleur #248 au texte ci-dessus

text-decoration:none;

Indique le type de soulignement du texte (ici aucun).

A noter que : le lien ainsi que son style seront aussi appliqués au contenu ajouté par :before et :after. En ce qui concerne le soulignement, celui du lien sera disposé par dessus celui spécifié dans le style ci-dessus. Le text-decoration:none ne sert donc à rien car si le lien est lui-même souligné, ce soulignement sera visible sous le contenu de :before

Exemple de code sur lequel ce style sera appliqué :

<div class="A B">rien</div>
<div class="B">
<div lang="fr-FR"><a href="http://www.truc.com">machin</a></div>
</div>

Voila, j'espère ne rien avoir oublié et ne pas avoir fait d'erreurs ;)
# décembre 14, 2005 20:14

cyril a dit :

Félicitations :)

je n'ai rien à rajouté, c'est tout à fait ca! finalement je n'ai pas eu à faire d'explications.

Pour en savoir plus sur les selecteurs vous pouvez aller voir : http://www.w3.org/TR/REC-CSS2/selector.html
# décembre 14, 2005 20:22

azra a dit :

Ca marche sous IE ce truc? !!

Sinon pour le défis, je dis pas mieux ici :p (et je retourne coté serveur).
# décembre 14, 2005 22:31
Les commentaires anonymes sont désactivés

Les 10 derniers blogs postés

- Office 365: Nettoyage des versions de List Item avant migration depuis SharePoint On Premise vers SharePoint Online par Blog Technique de Romelard Fabrice le 08-08-2017, 15:36

- Office 365: Comment supprimer des éléments de liste SharePoint Online via PowerShell par Blog Technique de Romelard Fabrice le 07-26-2017, 17:09

- Nouveau blog http://bugshunter.net par Blog de Jérémy Jeanson le 07-01-2017, 16:56

- Office 365: Script PowerShell pour assigner des droits Full Control à un groupe défini par Blog Technique de Romelard Fabrice le 04-30-2017, 09:22

- SharePoint 20XX: Script PowerShell pour exporter en CSV toutes les listes d’une ferme pour auditer le contenu avant migration par Blog Technique de Romelard Fabrice le 03-28-2017, 17:53

- Les pièges de l’installation de Visual Studio 2017 par Blog de Jérémy Jeanson le 03-24-2017, 13:05

- UWP or not UWP sur Visual Studio 2015 ? par Blog de Jérémy Jeanson le 03-08-2017, 19:12

- Désinstallation de .net Core RC1 Update 1 ou SDK de Core 1 Preview 2 par Blog de Jérémy Jeanson le 03-07-2017, 19:29

- Office 365: Ajouter un utilisateur ou groupe dans la liste des Site collection Administrator d’un site SharePoint Online via PowerShell et CSOM par Blog Technique de Romelard Fabrice le 02-24-2017, 18:52

- Office 365: Comment créer une document library qui utilise les ContentTypeHub avec PowerShell et CSOM par Blog Technique de Romelard Fabrice le 02-22-2017, 17:06