Sujet Précédent Sujet Suivant

[HMTL] Textearea

Résolu/Fermé
Utilisateur anonyme - 6 oct. 2007 à 13:08
 Utilisateur anonyme - 8 oct. 2007 à 10:28
Bonjour, je voudrais inserer dans une page html de mon nvo site en consctruction, une textarea. Voilà, en fait, mon problème est simple. J'ai un design pour mon site et l'espace que je reserve au texte (qui est un chapitre de fanfiction, donc très long) me demonterait toute la page si je l'inserait comme ça dedans. Je pensais mettre une textarea, ce qui serait la meilleure solution à mes yeux, creant ainsi un ascenceur sur la textarea et protegeant l'agencement de ma page.
Seulement, une textarea, c'est par-defaut blanc et avec des bordures.

Ma question est simple, est-ce possible de changer le couleur de fond de la textarea et de supprimer les bordures ?

Merci pour vos réponses,

Phénix

6 réponses

Réponse 1 / 6
Gihef Messages postés 5150 Date d'inscription mercredi 20 juillet 2005 Statut Contributeur Dernière intervention 20 février 2023 2 778
6 oct. 2007 à 15:36
Bonjour,

Tu peux aussi t'y prendre autrement.
Un bloc de texte géré par CSS de dimensions précises et un “overflow:auto;” pour que le texte puisse défiler.

Essaye :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<title></title>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <style type="text/css">
    html, body {
      margin: 0;
      padding: 0;
      text-align: center;
      background-color: #b0c4de;
      }
    #conteneur {
      position: relative;
      margin: 0 auto;
      width: 760px;
      height : 400px;
      border : 1px solid #f0ffff;
      background-color: #f0ffff;
      font-family: Tahoma, 'Trebuchet MS', Verdana, Optima, Papyrus, sans-serif;
      }
    #chapitre {
      margin: 0 auto;
      width: 360px;
      height : 200px;
      margin-top : 100px;
      font-size : .8em;
      text-align : justify;
      color : #fff;
      background-color: #4b0082;
      overflow : auto;
      }
    #chapitre p {
      margin : 1em;
      }
    </style>
</head>
<body>
  <div id="conteneur">
    <div id="chapitre">
      <h1>Le chapitre</h1>
      <p>Et dedans, le texte. Et s'il y en a beaucoup, un overflow:auto; affiche les ascenseurs.</p>
      <p>
      Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
      Nulla vel leo.
      Integer id velit ac pede gravida scelerisque.
      Praesent ligula justo, rhoncus ut, consequat quis, consectetuer vitae, leo.
      Donec congue quam sit amet turpis.
      Phasellus dolor leo, rutrum in, pretium elementum, consectetuer at, massa.
      Maecenas tellus.
      Quisque ac erat ut augue nonummy euismod.
      Aenean sollicitudin tincidunt magna.
      Curabitur mattis, pede non volutpat laoreet, ipsum ipsum commodo velit, ac facilisis leo dui non turpis.
      Mauris bibendum laoreet tortor.
      Vestibulum placerat dignissim sem.
      Nulla faucibus dictum risus.
      </p>
      <p>
      Vivamus vel sapien eget lacus consectetuer viverra.
      Nullam nibh nisl, gravida sed, vestibulum sed, mattis vitae, felis.
      Praesent volutpat pede nec ante.
      Nam bibendum.
      Duis nonummy est a velit.
      Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
      Etiam tristique eleifend lorem.
      Quisque nec pede sit amet eros sagittis gravida.
      Ut massa diam, nonummy id, lacinia id, imperdiet vitae, diam.
      Morbi non justo sit amet sem commodo gravida.
      Donec facilisis sem at tortor.
      Duis vel libero.
      Integer sagittis tortor ut nisi.
      Curabitur massa nulla, nonummy a, fringilla id, rutrum ut, sem.
      Nulla varius mi vitae pede.
      Aenean tristique euismod velit.
      Maecenas porttitor enim in urna.
      Maecenas facilisis ornare dui.
      Quisque pretium dignissim purus.
      </p>
      <p>
      Praesent id velit quis quam accumsan fringilla.
      Morbi pretium.
      Aliquam ut odio viverra nunc auctor pulvinar.
      Aenean ligula.
      Nam risus.
      Vestibulum ac nulla eu nisi nonummy euismod.
      Donec volutpat.
      Nam est velit, rutrum nec, malesuada id, tincidunt bibendum, mi.
      Cras lorem libero, aliquam ac, commodo ut, pharetra eu, sapien.
      Etiam porttitor vestibulum arcu.
      Sed bibendum euismod sem.
      </p>
      <p id="generated">Generated 3 paragraphs, 259 words, 1761 bytes of 
      <a href="https://www.lipsum.com/" title="Lorem Ipsum" style="color:#b0c4de;">Lorem Ipsum</a></p><br />
    </div>
  </div>
</body>
</html>

--
0
Réponse 2 / 6
Utilisateur anonyme
7 oct. 2007 à 12:42
Ok merci, je vais essayer ça et je te tiens au courant ! ^^

Merci
0
Réponse 3 / 6
Utilisateur anonyme
7 oct. 2007 à 14:37
Yes, cest cool

Après quelques petites modifications, j'ai trouvé ce que je cherchais, super cool !

Par contre, il me reste juste un detail. Est-ce que tu sais comment je peux changer la couleur de l'ascenceur ? Histoire qu'elle se fonde à mon design ?

Merci encore
0
Réponse 4 / 6
Gihef Messages postés 5150 Date d'inscription mercredi 20 juillet 2005 Statut Contributeur Dernière intervention 20 février 2023 2 778
7 oct. 2007 à 15:29
IE seul interprète se genre de bidouille : http://fr.selfhtml.org/css/proprietes/fenetreaffichage.htm#scrollbar

--
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 6
ilan27 Messages postés 394 Date d'inscription mardi 25 septembre 2007 Statut Membre Dernière intervention 15 juin 2009 36
7 oct. 2007 à 17:13
Bonjour,
Si tu veux ce type de "simplification pour entrer du texte long", et que tu veux le décorer à ta manière, tu peux aussi utiliser les iframe, qui est comme une fenêtre dans une autre. Mais tu peux choisir les bordures, l'arriere-plan qui peut être une image...etc... comme une vrai page insérée.
Dis moi si tu veux plus de détails
0
Réponse 6 / 6
Utilisateur anonyme
8 oct. 2007 à 10:28
Je sais, je connais les iframes, mais je sais aussi que ce n'est pas l'ideal pour les utilisateurs mal-voyants qui utilisent des lecteurs de texte car le logiciel ne passe pas dans les iframes. (je bosse dans une boite qui creer des sites web, ca aide aussi)

Mais merci quand même pour cette solution ^^

Gihef => Hum, le problème de ma scrollbar, c'est que moi j'utilise Firefox......... Mais bon tant pis, c'est pas bien grave.


Merci encore a tous !
0

Discussions similaires

la balise <br> ou <br />
faamugol -
rwaness -

8 réponses