Scribd Logo
Importer

Bienvenue sur Scribd !

  • Application Cours

    Transféré par

    tandrayen
    22 vues6 pages

    Titre original

    application cours

    Copyright

    © © All Rights Reserved

    Formats disponibles

    PDF, TXT ou lisez en ligne sur Scribd

    Avez-vous trouvé ce document utile ?

    Ce contenu est-il inapproprié ?

    Signaler ce document

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    22 vues6 pages

    Application Cours

    Transféré par

    tandrayen

    Droits d'auteur :

    © All Rights Reserved
    Téléchargez comme PDF, TXT ou lisez en ligne sur Scribd
    Signaler comme contenu inapproprié
    sur 6

    la base

    Nous allons commencer par créer un document html très petit, et nous l'enrichirons au fur et à
    mesure. Lancez d'abord Notepad++, et recopiez le texte suivant :

    Créez un répertoire sous le nom de HTML puis un sous-répertoire TP1 :

    HTML/TP1/Ex1.html), et enregistrez ce fichier sous le nom Exemple1.html.

    À l'aide d'un navigateur (konqueror ou firefox, par exemple), regardez votre page. Nous allons
    modifier cette page progressivement (n'hésitez pas à faire d'autres changements que ceux
    proposés, en vous en inspirant), et il faudra vérifier à chaque nouvelle étape à quoi ressemble
    maintenant votre page en rechargeant la page.

    …………………………………………………………………………………………………
    …………………………………………………………………………………………………
    …………………………………………………………………………………………………

    Titres
    Changeons un peu le texte de notre page, pour quelque chose comme :

    Ajoutez ces lignes dans la page précédente, et vérifier l'affichage. Avez-vous besoin d'ajouter
    la balise <br> après une balise d'entête <h1-6> ou un paragraphe <p> ? Pourquoi ?

    …………………………………………………………………………………………………
    …………………………………………………………………………………………………
    …………………………………………………………………………………………………

    Énumérations
    Copier ce code dans la page html:

    Dans le code précédent, on vient de créer une liste. Que se passe-t-il si on remplace ul par ol ?
    Créez une liste, dont le premier élément commencera par le mot « Les peintres », suivi d'une
    liste numérotée avec dans l'ordre vos trois peintres favoris. Le second élément sera la même
    chose avec « Les musiciens ». Vous ferez de plus suivre le nom de votre musicien préféré
    d'une liste numérotée de ses trois meilleures chansons. Vous pourrez ensuite essayer de
    remplacer un <ol> par <ol start="42"> et la deuxième <li> par <li start="100">.

    Tableaux

    Le tableau n'est pas encore complet. Comment peut-on ajouter les bordures ? Ajoutez à la
    balise table un l'attribut style pour modifier les propriétés suivantes :

    <table border="1">

    Liens

    Votre document commence (enfin ce qu'il y a après <body>) sans doute par un
    titre <h1>Titre</h1>.

    Remplaçons-le par : <a name="debut"><h1>Titre</h1></a>.

    Ajoutez maintenant le texte suivant (avec la mise en forme):


    Oubliez les débats et les meetings, selon une étude américaine, notre orientation
    politique est déterminée par notre cerveau. (article de yahoo.fr)

    Il y aurait donc des cerveaux siglés Hollande et d'autres Sarkozy. À quelques mois de
    l'élection présidentielle, voilà une révélation qui devrait grandement simplifier la tâche des
    sondages. Point de machination électorale bleu-blanc-rouge, rassurez-vous, l'étude en
    question n'a pas été réalisée dans l'Hexagone, mais de l'autre côté de l'Atlantique (où la
    campagne présidentielle fait également rage, cela dit). Et c'est The Guardian qui relate les
    principales conclusions de cette enquête. Et si le cerveau d'un électeur de droite n'était pas le
    même que celui d'un électeur de gauche ?

    C'est ce qu'ont imaginé des chercheurs de l'université Lincoln dans le Nebraska, aux États-
    Unis, en constatant que les esprits conservateurs réagissaient davantage aux stimuli négatifs
    que les libéraux, qui, eux, seraient plus réactifs aux stimuli positifs. Une étude réalisée en
    avril 2011 par des membres de l'University College of London nous apprenait déjà que la
    structure cérébrale pouvait varier en fonction des opinions politiques. Les conservateurs, nous
    apprenait-on, posséderaient un plus petit cortex cingulaire antérieur (région cérébrale associée
    à la prise de décision) et des amygdales (région des émotions liées à la peur et à l'anxiété) plus
    développées que les libéraux. Qui l'eût cru ?

    Et les centristes ?

    Cette nouvelle étude américaine, qui repose sur les concepts de stimuli appétitif et aversif, va
    plus loin. Le principe de l'expérience est simple : l'équipe de chercheurs a présenté à un
    groupe de deux cents personnes une série d'images plaisantes ou désagréables et a analysé les
    réactions du cerveau de chacun des cobayes. Elle a ainsi distingué deux groupes : ceux qui se
    focalisaient sur les images plaisantes

    à la fin de votre document (avant </body>), ajouter : <p> Lien vers <a href="#debut">en
    haut</a></p>. Cliquez dessus dans le navigateur.

    Ajoutez alors le code suivant:

    Un <a href="http://www.google.html" title="Google selon moi"> Pour aller sur le site de


    gogle </a>.<br />

    Cliquez dessus dans le navigateur. A quoi sert l'attribut "title" ?

    Images

    Si vous avez une image dans vos fichiers, tant mieux. Sinon, téléchargez-en une sur internet,
    n'importe laquelle. Créez un sous-répertoire photo dans ~/HTML/TP1/, et mettez cette image.
    Vous pouvez maintenant ajouter le code : <img src="../photo/monimage.jpg" alt="texte
    alternatif" title="comme une image" > en adaptant au nom de l'image.
    .. : pour remonter un répertoire.
    ./ : pour le répertoire courant

    APPLICATION N° 2

    Vous aimerez peut-être aussi