Docu 9, 10 et 11

This commit is contained in:
raphaelgoettter 2015-03-09 16:53:04 +01:00
parent 7203d5d406
commit 6f4aefbbb1
3 changed files with 87 additions and 3 deletions

View file

@ -1 +1,71 @@
# todo
# Divers
La feuille de style "fourre-tout" de KNACSS, où l'on retrouve des règles pratiques dans certains contextes, mais pas suffisamment universelles pour être appliquées par défaut dans un framework.
## Liens d'évitement
Les [liens d'évitement](http://www.alsacreations.com/tuto/lire/572-Les-liens-d-evitement.html) sont prévus pour faciliter la navigation au clavier, ils sont indispensable dans une optique de parfaite accessibilité.
KNACSS propose des styles par défaut pour ces liens : masqués au départ, ils deviennent visibles lorsque la touche `tab` est utilisée.
```css
.skip-links {
position: absolute;
}
.skip-links a {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
padding: 0.5em;
background: black;
color: white;
text-decoration: none;
}
.skip-links a:focus {
position: static;
overflow: visible;
clip: auto;
}
```
## Césures
KNACSS gère automatiquement les césures et les mots longs dès lors que le point de rupture "small" est atteint.
```css
@media (max-width: 768px) {
/* you shall not pass */
div,
textarea,
table,
td,
th,
code,
pre,
samp {
word-wrap: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}
}
```
## Google maps
KNACSS règle les bugs d'affichage dans le cas spécifique des images google.
```css
.gm-style img {
height: 100%;
}
:not(.gm-style) img {
height: auto;
}
.gm-style img,
.gmnoscreen img,
.gmnoprint img {
max-width: none !important;
}
```

View file

@ -1 +1,11 @@
# todo
# Décorations diverses
Dans cette feuille de style, KNACSS apporte un minimum de décoration à divers éléments habituels.
Il ne s'agit pas d'un "reset" mais bien d'une couche de design qu'il n'est bien entendu pas du tout indispensable de conserver.
- les élements de code (`code`, `pre`)
- le surlignement (`mark`)
- les contenus en exposant ou en indice (`sup`, `sup`)
- les citations (`q`, `blockquote`)
- les séparateurs (`hr`)
- les tableaux de données

View file

@ -1 +1,5 @@
# todo
# Styles WordPress
Cette feuille de style, exclusivement dédiée au CMS WordPress, constitue en un "reset" de base pour cet outil que nous employons fréquemment au sein de l'agence Alsacréations.fr.
C'est Geoffrey Crofte qui a conçu ce fichier de bonnes pratiques (basée sur un socle proposé par Automattic), n'hésitez pas à le contacter sur son site perso [CreativeJuiz](http://www.creativejuiz.fr/) si vous avez la moindre question à son propos.