IP Girl
  1. IP Girl
  3. Enveloppement du texte à l’intérieur de l’entrée type = élément «text» HTML / CSS
Intereting Posts
Comment générer une chaîne d’une certaine longueur pour l’insérer dans un fichier afin de répondre à un critère de taille de fichier? Recadrer une image bitmap Dupliquer et renommer le projet Xcode et les dossiers associés Remplissage d’une liste d’entiers dans .NET Où stocker le fichier hôte Ansible sur Mac OS X Devrais-je utiliser shared_ptr ou unique_ptr Terminal Mac OS X: Option de carte + supprimer pour «supprimer le mot en arrière» Charger l’image à partir de la zone de ressources du projet dans C # Google Chrome – Ignorer la page blanche blanche entre les chargements de pages Web Instruction SQL pour obtenir le type de colonne Deux index à une seule colonne vs un index à deux colonnes dans MySQL? Twitter bootstrap 3 – créez un glyphicon personnalisé et ajoutez-le à la police de caractères glyphicon Comment remplacer le texte entre guillemets dans vi PowerShell: créer un compte d’utilisateur local Fonction de timer pour fournir du temps en nano secondes en C ++

Enveloppement du texte à l’intérieur de l’entrée type = élément «text» HTML / CSS

Le HTML ci-dessous,

est affiché dans un navigateur comme ceci:

Quand j’ajoute le texte suivant,

Le rapide renard brun sauta par dessus le chien paresseux.

En utilisant le code HTML ci-dessous,

il est affiché dans un navigateur comme ceci:

Mais je voudrais qu’il soit affiché dans un navigateur comme celui-ci:

Je veux que le texte de mon élément d’entrée s’emballe. Cela peut-il être accompli sans une zone de texte?

C’est le travail de textarea – pour la saisie de texte multiligne. L’ input ne le fera pas ; il n’a pas été conçu pour le faire.

Donc, utilisez un textarea . Outre leurs différences visuelles, elles sont accessibles via JavaScript de la même manière (propriété value ).

Vous pouvez empêcher la input nouvelles lignes via l’événement d’ input et simplement utiliser un replace(/\n/g, '') .

Word Break imitera une partie de l’intention 

 input.break { word-wrap: break-word; word-break: break-all; height: 80px; }

Vous ne pouvez pas utiliser d’entrée pour cela, vous devez plutôt utiliser textarea. Utilisez textarea avec le code wrap="soft" et facultatif le rest des atsortingbuts comme ceci:

Atsortingbuts: Pour limiter la quantité de texte par exemple aux caractères “40”, vous pouvez append l’atsortingbut maxlength="40" comme ceci: Pour masquer le style du défilement. si vous utilisez uniquement le overflow:scroll; faites overflow:scroll; ou overflow:hidden; ou overflow:auto; cela ne prendra effet que pour une barre de défilement. Si vous voulez des atsortingbuts différents pour chaque barre de défilement, utilisez les atsortingbuts comme ce overflow:scroll; overflow-x:auto; overflow-y:hidden; overflow:scroll; overflow-x:auto; overflow-y:hidden; dans la zone de style: Pour rendre la zone de texte non redimensionnable, vous pouvez utiliser le style avec resize:none; comme ça: