search

evefevrier / anticoste

P2 - Réalisation du projet Anticoste de l'artiste Richard Baillargeon, par les étudiants de 1ère année du programme Techniques d'intégration multimédia du Cégep de Sainte-Foy
0 stars 19 forks source link

Quelle est meilleure manière d'intégrer le visuel de l'expérience immersive? #67

Open jeffduval opened 3 years ago

jeffduval commented 3 years ago

image À la suite des nouveaux textes pour l'expérience immersive fournis au dernier cours, il y a une représentation visuelle des touches raccourci pour afficher en plein écran(voir photo). Est-il mieux ou plus rapide de créer cette bande en design et de l'importer dans une balise picture ou de carrément créer les boîtes en html et de les styler et positionner dans le css? Des avis?

evefevrier commented 3 years ago

Bonjour @jeffduval ! Je prioriserais une intégration purement html et css, sans aucune image:

Afin de vivre pleinement l'expérience immersive... des touches ci-dessous:

<dl>
    <dt>MacOs</dt>
    <dd>
        <kbd aria-label="Touche contrôle">Ctrl ˆ</kbd>
        <kbd aria-label="Touche commande">Cmd ⌘</kbd>
        <kbd aria-label="Touche F">F</kbd>
    </dd>
    <dt>Windows</dt>
    <dd><kbd aria-label="Touche F11">F11</kbd></dd>
</dl>

Pour revenir à un mode d'affichage régulier, appuyer sur la touche 

<kbd aria-label="Touche Escape">Échap</kbd>
evefevrier commented 3 years ago

Explications pour les balises:
<dl> = description list
<dt> = description term
<dd> = description
<kbd> = keyboard
Et pour les CSS, ajouter quelque chose comme

kbd{
            font-size: 0.85em;
            border: 1px solid;
            border-bottom-width: 2px;
            border-color: #ddd #bbb #bbb #ddd;
            background: #f9f9f9;
            padding: 1px 3px;
            white-space: nowrap;
            border-radius: 3px;
        }