Changer l'apparence de la barre verticale d'un input text

Résolu/Fermé
ProgProject Messages postés 71 Date d'inscription vendredi 8 août 2014 Statut Membre Dernière intervention 20 juillet 2017 - Modifié par html42 le 9/08/2015 à 23:41
ProgProject Messages postés 71 Date d'inscription vendredi 8 août 2014 Statut Membre Dernière intervention 20 juillet 2017 - 10 août 2015 à 18:37
Bonjour,
je suis entrain de créé mon deuxième site mais j'ai un problème (Je sais si je pose une question s'est que j'ai forcément un problème)
enfaîte je voudrais changer l'apparence de la barre verticale dans un input text:


en ça:



Si vous avez la réponce répondez-moi ça serais sympa
A voir également:

3 réponses

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
9 août 2015 à 23:53
Bonjour

en quel langage ?
0
ProgProject Messages postés 71 Date d'inscription vendredi 8 août 2014 Statut Membre Dernière intervention 20 juillet 2017 2
10 août 2015 à 13:10
En html, css, php, JS comme vous voulez je m'adapte
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
10 août 2015 à 14:25
Salut,

Un début de solution :
<!-- HTML -->
<label class="prompt">
    C:\Users\hp>--->
    <input type="text" />
</label>

/* CSS */
.prompt, .prompt input {
    background-color: black;
    color: green;
    font-family: "Lucida Console";
}

.prompt {
    display: inline-block;
    border: solid 1px gray;
}

.prompt input {
    border: none;
}


Bonne journée
0
ProgProject Messages postés 71 Date d'inscription vendredi 8 août 2014 Statut Membre Dernière intervention 20 juillet 2017 2
10 août 2015 à 14:50
dsl mais enfaite je veux pas :C:\Users\hp>--->
mais sa: _ a la place de sa: |
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
10 août 2015 à 15:15
D'accord je n'avais pas du tout compris ta question.

Il ne semble pas exister de solution simple pour ce que tu souhaites, il existe néanmoins la solution proposée ici : https://stackoverflow.com/questions/3758023/how-to-use-this-square-cursor-in-a-html-input-field

Le principe est d'utiliser javascript pour "faire croire" à l'utilisateur qu'il saisie son texte dans un div en utilisant un input caché. Il suffit ensuite de styliser comme on le souhaite le div en question.

Bonne journée
0
ProgProject Messages postés 71 Date d'inscription vendredi 8 août 2014 Statut Membre Dernière intervention 20 juillet 2017 2
10 août 2015 à 16:44
enfaite ça marche pas
0
Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 524
10 août 2015 à 16:59
La solution proposée fonctionne, il y as même un lien de démonstration pour t'aider : http://jsbin.com/ehuki3/3/edit

Merci de donner plus de détail si tu n'arrives pas à le faire fonctionner, puisque en fait ça marche bien.
0
ProgProject Messages postés 71 Date d'inscription vendredi 8 août 2014 Statut Membre Dernière intervention 20 juillet 2017 2
10 août 2015 à 18:37
enfaite au lieu d'un input j'ai du placer un immence testarea et enfaite sa ne va pas ducoup
0