background preloader

Css

Facebook Twitter

Opensource

GX - Full-Featured Javascript Animations Framework | Demos. POMPAGE - Les listes de définitions : mal utilisées ou mal compr. Par Russ Weakley Les listes de définitions, qu'est-ce que c'est ? Quand faut-il les utiliser ? Et comment les styler pour qu'elles ressemblent à des tableaux, des galeries d'images, des calendriers, etc. Les listes de définitions, qu'est-ce que c'est ? Les listes de définitions comportent deux parties, un terme et une description. Pour marquer une liste de définitions, il vous faut trois éléments HTML : un <dl> conteneur, un terme de définition <dt>, et une description de définition <dd>.

Par exemple : <dl><dt>Grenouille</dt><dd>Truc vert humide</dd><dt>Lapin</dt><dd>Truc chaud et doux</dd></dl> Vous pouvez utiliser plusieurs <dt> et <dd> dans la même liste de définitions : <dl><dt>Pointer</dt><dd>Viser à la pétanque</dd><dd>Marquer comme fait</dd></dl><dl><dt>Fordisme</dt><dt>Taylorisme</dt><dd>Tout sauf des vacances<dd></dl> Vous pouvez aussi utiliser des éléments de type bloc dans une description de définition, comme un <p> ou un <ul>.

DT: Orateur DD: Citation DT: Image DD: Description DT: Mot. [Webdesign] CSS Redundancy Checker, le webware ultime pour netto. A force de faire évoluer le design de nos sites, nous avons des feuilles de styles CSS qui contiennent des sélecteurs et des styles superflus. Les nettoyer à la main prend un temps considérable, car pour chaque style « suspect » il faut vérifier sur différentes pages l’incidence qu’il a. Il y a bien des outils qui aident au moins à trouver les styles non utilisés comme l’extension pour Firefox « Dust-Me selectors », mais il sont peu pratique lorsque les styles sont utilisés sur plusieurs pages. Par exemple, sur un blog, la page d’accueil n’affiche pas de commentaires, et donc, tous les styles liés aux commentaires ne sont pas utilisés.

Du coup, l’outil affiche un nombre variables de sélecteurs inutiles. Il faut recouper les listes pour arriver à un résultat pertinent. CSS Redundancy Checker est un webware ultra intéressant . CSS Redundancy Checker est à la fois simple et complet. Le résultat est tout simple mais ô combien pratique: Bien entendu ce webware est gratuit. CSS Message Boxes for different message types. Can you believe this: Few days ago I went to my bank to check my credit score with the Credit Bureau. The bank official typed in my personal data and sent a request.

Web application responded by displaying a yellow message box with an exclamation icon saying that data processing is still in progress. He checked several more times, but he didn't notice that at one moment the message changed to "Account available". But the message box hasn't changed. He continued to check a few more times and eventually he realized that the request was successful. I don't know what was in the minds of developers and designers who created this application, but it certainly wasn't the user. This poor bank official was really frustrated. To prevent this, different message types should be displayed differently. I will show you a remake of CSS message boxes I used on my latest project. Let's first take a quick look at message types. 1. Informational messages 2. Success Messages 3. Warning Messages 4. 1. 2. 3. 4. Image-free CSS Tooltip Pointers - A Use for Polygonal CSS? | Fil.

Posted by Scott on 03/03/2009 A while back, Tantek Celik released A Study of Regular Polygons, which used a little-known CSS trick to create non-rectangular shapes such as triangles and pentagons with nothing more than an ordinary HTML element. The experiment is very interesting and really cool, but the practical takeaway wasn’t immediately clear. Recently however, we've been working on building the markup for upcoming jQuery UI widgets, we came across a case that prompted us to take another look at the technique. The tooltip widget design, fairly common in websites these days, uses a small triangular "speech bubble" pointer that is typically created quite easily with a background image.

However, we wanted to maintain our commitment to keeping our jQuery UI widgets entirely themable, and using an image for that purpose wouldn't fit with the flexibility jQuery UI requires. How to solve this problem without any need for images? The Design Approach As demonstrated here: Woohoo! A Demonstration. Free CSS Toolbox - Free CSS Validator, CSS Formatter, CSS Compre.