VIM

Editeur ligne de commande linux apt-get install vim

vim monficher –> ouvrir le fichier à éditer  

ESC :syntax on –> coloration syntaxique  
ESC :nu –> numérotation des lignes 
ESC –> Retour à la navigation dans le document (à faire tout le temps avant de continuer) 
touches flèche ou hjkl pour naviguer H haut de l’écran L en bas
i ou touche insert –> Modification (insert)  
v –> sélection de bloc de lignes (mode visuel)  
CTRL v –> sélection de bloc (mode visuel)  
gg –> début du fichier  
G –> fin du fichier  
$ –> fin de la ligne  
0 –> début de la ligne  
: –> Action (mode commande)
ESC :w –> enregistre
ESC :q –> quitte  ESC:q! quitte sans enregistrer
ESC :help commande
D –> couper la ligne   P –> Coller
O –> inserer une ligne
u –> annule la dernière action
/ –> recherche n –> continue la recherche
* –> recherche le mot sous le curseur

Le pavé numérique du clavier n’est pas toujours reconnu… utiliser les chiffres du clavier normal

CSS avec des variables

  :root {
    --main-bg-color: brown;  // set variable
  }
  .menu {
    color: white;
    background-color: var(--main-bg-color);
  }
  .page {
    color: red;
    background-color: var(--main-bg-color);
 }

Il peut être intéressant de définir des variables dans les CSS. Cet exemple ce code n’est pour l’instant utilisable qu’avec Firefox version bureau.. les autres navigateurs risquent de s’y mettre, à surveiller

CSS bouts de trucs

Calcul dans les styles

<style>
  #monobjet[
    width:180px;
    width:100%;    // tout le div contenant
    margin-left:180px;  // monobjet va sortir de 180px vers la droite
      // solution
    width:calc(100% - 180px);  // tout le div contenant - 180px;  
      // calcul avec + - * /  des % px, em  ne pas oublier d’entourer les opérateurs par des espaces
  }
</style>

Pour afficher un truc du genre : Ctrl+Shift+M

<kbd class="kbd">Ctrl</kbd>+<kbd class="kbd">Shift</kbd>+<kbd class="kbd">M</kbd>
<style>
kbd {
    background-color: #f7f7f7;
    border: 1px solid #ccc;
    color: #333;
    font-size: 11px;
    line-height: 1.4;
    text-shadow: 0 1px 0 #fff;
    display: inline-block;
    padding: .1em .6em;
    margin: 0 .1em;
    white-space: nowrap;
    box-shadow: 0 1px 0 rgba(0,0,0,.2),0 0 0 2px #fff inset;
    border-radius: 3px;
}
</style>