Débutant demande aide

Salut à tous,

voila j'ai petit souci avec le code suivant, je n'arrive pas à modifier la taille texte en pixel. Je voudrais obtenir la lette "a" à 16px et la lettre "b" à 14px

Merci d'avance pour vos réponse.

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Document sans nom</title>
</head>

<body>
<div id="1">a<br>b<br>c</div>
</body>
</html>

12 réponses

  1. Salut.

    Tu peux utiliser la balise <span>. Elle ne modifie pas l'élément, mais tu pourras la sélectionner en CSS (tu peux utiliser les attributs class ou id) et styler le contenu de cette balise. Ou tu peux directement utiliser l'attribut style pour mettre le CSS dedans.

    <div id="1">
        <span style="font-size:16px">a</span><br />
        <span style="font-size:14px">b</span><br />
        c<br />
    </div>
    0
    1. Un grand merci à toi!

      Sinon, j'ai un dernier problème d'affichage entre Safari, Firefox et Explorer.

      comme vous pouvez le voir sur le lien ci-dessous selon le navigateur, le texte n'est pas de la même longueur.

      https://www.imagup.com/data-recovery-solutions-for-small-businesses-of-san-francisco/

      Savez-vous d'où peux provenir le problème, et comment le corriger?

      Code:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
      <title>Document sans nom</title>
      <style type="text/css">
      #CP {
      width: 780px;
      margin-right: auto;
      margin-left: auto;
      }
      #C11 {
      text-align: justify;
      width: 780px;
      font-family: "Century Gothic";
      font-size: 11px;
      }
      </style>
      </head>

      <body>
      <div id="CP">
      <div id="C11"><strong>LES ARCHITECTES DU TEMPS</strong><br />
      <br />
      Depuis 1911, les Architectes du Temps consacrent leur talent, leur
      passion et leur créativité au design et à la fabrication de montres
      distinctives, perpétuant une réelle fascination.<br />
      <br />
      Premières esquisses, plans à l'échelle, matériaux nobles, proportions
      harmonieuses, courbes originales, textures lisses, détails de finition,
      autant de vocabulaire que la création des montres Ebel et le monde de
      l'architecture partagent. Il ne s'agit pas uniquement d'un hasard
      linguistique, mais d'un même esprit que l'on retrouve dans ces deux
      disciplines exigeantes.<br />
      <br />
      Dans l'horlogerie comme dans l'architecture, c'est un mélange de
      raffinement artistique et de précision technique qui permet aux oeuvres
      d'allier la fonction et l'émotion. Tout en remplissant clairement une
      ou plusieurs missions pratiques, la forme d'une véritable création
      architecturale, qu'elle soit un bâtiment ou une montre, est imprégnée
      d'une esthétique évidente, d'une grande sophistication et d'un sens
      artistique remarquable.<br />
      <br />
      De la conception à la production de chaque montre Ebel, une technologie
      de pointe et un savoir-faire exceptionnel se combinent à une
      inspiration visionnaire, dans le respect des normes de qualité élevées
      fixées par les Architectes du Temps.<br />
      <br />
      <br />
      <strong>LES RÈGLES DE QUALITÉ</strong><br />
      <br />
      Ebel à toujours fait de la qualité une philosophie d'entreprise. Les
      normes techniques sans compromis qu'elle applique, correspondant au
      label «Swiss Made», sont les plus élevées du secteur horloger. La
      priorité absolue d'Ebel est la satisfaction de ses clients, et ce souci
      constant de la qualité est une des principales caractéristiques
      immuables dans toutes les collections de la marque.<br />
      <br />
      Cette détermination à toute épreuve s'appuie sur un certain nombre de
      moyens techniques et de procédures, tels que l'utilisation de systèmes
      éprouvés, testés et brevetés. Par exemple, le système breveté
      garantissant l'étanchéité des couronnes Ebel fonctionne même lorsque
      l'espace est très restreint, comme dans certains modèles pour dames.
      Ebel insiste sans relâche sur tous les détails, même les plus infimes,
      afin de maintenir le niveau de qualité qu'elle s'est fixé. Ainsi, dans
      une glace de montre comme celle de la collection Tarawa, la plus petite
      inclusion ou bulle d'air nuirait à la fiabilité du produit et réduirait
      le plaisir de l'utilisateur.<br />
      <br />
      Les produits Ebel nécessitent les meilleurs composants et les matériaux
      les plus nobles: des diamants de qualité IF à VVS1, une nacre superbe
      pour les cadrans ou encore un cuir d'alligator pleine peau et cousu
      main pour les bracelets. Les experts en sertissage de pierres calculent
      l'orientation de chaque diamant pour qu'il brille de mille feux. De
      même, la création est mise en valeur par sa finition: un brossage
      satiné ou un polissage irréprochable, réalisé de manière à magnifier la
      montre et à souligner ses formes.<br />
      <br />
      Les étapes de la production d'une montre Ebel ne comportent pas moins
      de 235 points de contrôle, tous aussi cruciaux et sévères, afin
      d'assurer la fiabilité de chaque composant et de garantir sa longévité. Toutefois, au-delà de la technologie et des machines ultra
      perfectionnées employées à chaque étape, ce sont indubitablement
      l'expérience et les connaissances humaines qui jouent le rôle le plus
      important dans le respect des normes de qualité.</div>
      </div>
      </body>
      </html>
      0
      1. Les navigateurs n'ont pas les mêmes valeurs CSS par défaut.
        Tu peux utiliser une feuille de reset en CSS.
        0
        1. Pardon j'suis un peux perdu (j'suis débutant)

          Comment je peux faire ça?
          0
          1. Merci malheureusement j'y ai rien compris. C'est beaucoup trop compliqué pour moi.
            0
            1. quelqu'un aurais l'amabilité de me modifier ce code afin d'aller de l'avant?
              0
              1. Tu as juste à télécharger une feuille de reset qui n'est rien d'autre qu'un fichier texte avec l'extension .css qui contient du CSS qui fait certaines choses.

                En voici une :
                https://meyerweb.com/eric/tools/css/reset/reset.css

                Pour l'inclure dans ta page :
                <link rel="stylesheet" href="reset.css" type="text/css" media="all" />
                0
                1. Ok merci, mais j'suis totalement perdu je l'ai telechargé ouvert et j'ai le code ci-dessous. Ensuite mon code ci-dessus, je le place ou exactement? Et ton code à toi (<link rel="stylesheet" href="reset.css" type="text/css" media="all" />) je le place ou dans mon code?

                  /* https://meyerweb.com/eric/tools/css/reset/ */
                  /* v1.0 | 20080212 */

                  html, body, div, span, applet, object, iframe,
                  h1, h2, h3, h4, h5, h6, p, blockquote, pre,
                  a, abbr, acronym, address, big, cite, code,
                  del, dfn, em, font, img, ins, kbd, q, s, samp,
                  small, strike, strong, sub, sup, tt, var,
                  b, u, i, center,
                  dl, dt, dd, ol, ul, li,
                  fieldset, form, label, legend,
                  table, caption, tbody, tfoot, thead, tr, th, td {
                  margin: 0;
                  padding: 0;
                  border: 0;
                  outline: 0;
                  font-size: 100%;
                  vertical-align: baseline;
                  background: transparent;
                  }
                  body {
                  line-height: 1;
                  }
                  ol, ul {
                  list-style: none;
                  }
                  blockquote, q {
                  quotes: none;
                  }
                  blockquote:before, blockquote:after,
                  q:before, q:after {
                  content: '';
                  content: none;
                  }

                  /* remember to define focus styles! */
                  :focus {
                  outline: 0;
                  }

                  /* remember to highlight inserts somehow! */
                  ins {
                  text-decoration: none;
                  }
                  del {
                  text-decoration: line-through;
                  }

                  /* tables still need 'cellspacing="0"' in the markup */
                  table {
                  border-collapse: collapse;
                  border-spacing: 0;
                  }
                  0
                  1. Il faut enregistrer le code CSS dans un fichier "reset.css" (fais Ctrl+S sur [cette page]) à côté de tes pages HTML.

                    Le code que je t'ai donné (<link ... />) est à mettre dans l'entête de ta page (entre <head> et </head>, déjà présents normalement).
                    0
                    1. Bon bin pour ton code je l'ai placé de cette manière, mais pour l'enregistrement du reset.css j'ai rien compris. Depuis quel menu on peut le faire avec Dreamweaver?

                      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
                      <html xmlns="http://www.w3.org/1999/xhtml">
                      <head>
                      link rel="stylesheet" href="reset.css" type="text/css" media="all" />
                      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
                      <title>Document sans nom</title>
                      </head>

                      <body>
                      </body>
                      </html>
                      0
                      1. Il manque le chevron < avant link.
                        Pour enregistrer le fichier, clique ici puis fais Ctrl+S. Tu dois l'enregistrer dans le même dossier que tes pages HTML, "à côté" de celles-ci si tu préfères.
                        0