interface Web
tutoriel CSS
Quelle est la différence entre le retour à la ligne et le débordement de texte ? Explication détaillée de deux propriétés
Quelle est la différence entre le retour à la ligne et le débordement de texte ? Explication détaillée de deux propriétés
Dans les styles CSS, de nombreuses personnes ne peuvent pas faire la distinction entre deux attributs, l'un est le débordement de texte et l'autre le retour à la ligne. Alors, quels sont les attributs de retour à la ligne et de débordement de texte ? Résumons les propriétés de retour à la ligne et de débordement de texte.
1 : le retour à la ligne force l'attribut de nouvelle ligne
En CSS3, nous pouvons utiliser l'attribut de retour à la ligne pour déterminer une longue chaîne de mots et d'URL, et s'ils peut être enveloppé Allez à la ligne suivante, il existe deux valeurs pour le retour à la ligne, à savoir normal et break-word. Normal représente la valeur par défaut et enveloppe automatiquement la ligne. La seconde consiste à définir la longueur de l'URL et à forcer. un saut de ligne.
Par exemple :
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS3 word-wrap属性</title>
<style type="text/css">
#lvye
{
width:200px;
height:120px;
border:1px solid gray;
}
</style>
</head>
<body>
<div id="lvye">Welcome to the Chinese website, where there is endless PHP knowledge to let you roam in the sea of knowledge.http://www.php.cn/div-tutorial-275623.html</div>
</body>
</html>L'effet d'aperçu du code ci-dessus dans le navigateur :
Si nous ajoutons un mot dans le div -wrap:break-word; forcera une nouvelle ligne si le mot est trop long, il sera hors de portée. Lors de la création d’un site Web, il suffit de choisir la valeur par défaut.
2 : attribut de débordement de texte
Lorsque nous prévisualisons une page Web, nous verrons toujours ce phénomène. Lorsque notre texte dépasse une certaine plage, il le fera. sera affiché sous forme d’ellipses et le texte supplémentaire ne sera pas affiché. Ce paramètre est en fait meilleur pour les utilisateurs et peut les aider à connaître plus de contenu.
Si nous voulons masquer le contenu redondant, nous pouvons utiliser l'attribut text-overflow. Généralement, text-overflow a également deux valeurs. Le premier cas est lorsque le texte déborde et que des points de suspension apparaissent, et l'autre est. lorsque le texte déborde et apparaît. Les points de suspension ne s'affichent pas.
la syntaxe de débordement de texte est :
text-overflow:ellipsis; overflow:hidden; white-space:nowrap;
La condition préalable est que ces trois conditions soient affichées en même temps pour être utilisées.
Par exemple :
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS3 text-overflow属性</title>
<style type="text/css">
#div1
{
width:200px;
height:100px;
border:1px solid gray;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
}
</style>
</head>
<body>
<div id="div1">php是最好的语言，欢迎大家学习交流</div>
</body>
</html>L'effet d'affichage est le suivant :
Ce qui précède est une explication détaillée du mot- Attributs wrap et text-overflow en css Introduction complète, si vous voulez en savoir plus sur le Tutoriel vidéo CSS, veuillez faire attention au site Web chinois php.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Outils d'IA chauds
Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes
AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.
Undress AI Tool
Images de déshabillage gratuites
Clothoff.io
Dissolvant de vêtements AI
AI Hentai Generator
Générez AI Hentai gratuitement.
Article chaud
Outils chauds
Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit
SublimeText3 version chinoise
Version chinoise, très simple à utiliser
Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP
Dreamweaver CS6
Outils de développement Web visuel
SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)
Comment obtenir des propriétés littérales entières en Python sans SyntaxError ?
Aug 20, 2023 pm 07:13 PM
Pour obtenir un attribut littéral au lieu d'une erreur de syntaxe, utilisez un espace ou des parenthèses. Les littéraux entiers sont un partif des littéraux numériques en Python.
Comment renommer les propriétés de JSON en utilisant Gson en Java ?
Aug 27, 2023 pm 02:01 PM
L'annotation Gson@SerializedName peut être sérialisée en JSON et avoir la valeur de nom fournie comme nom de champ. Cette annotation peut remplacer n'importe quelle FieldNamingPolicy, y compris la politique de dénomination de champ par défaut qui peut avoir été définie sur l'instance Gson. Différentes stratégies de dénomination peuvent être définies à l'aide de la classe GsonBuilder. Syntaxe@Retention(value=RUNTIME)@Target(value={FIELD,METHOD})public@interfaceSerializedNameExample importcom.google.gson.annotations.*;
Fonction dir() de Python : afficher les propriétés et les méthodes d'un objet
Nov 18, 2023 pm 01:45 PM
Fonction dir() de Python : afficher les propriétés et les méthodes d'un objet, exemple de code spécifique requis Résumé : Python est un langage de programmation puissant et flexible, et ses fonctions et outils intégrés offrent aux développeurs de nombreuses fonctionnalités pratiques. L'une des fonctions très utiles est la fonction dir(), qui nous permet de visualiser les propriétés et les méthodes d'un objet. Cet article présentera l'utilisation de la fonction dir() et démontrera ses fonctions et utilisations à travers des exemples de code spécifiques. Texte : la fonction dir() de Python est une fonction intégrée.
Que faire si les propriétés du disque Win11 sont inconnues
Jul 03, 2023 pm 04:17 PM
Que dois-je faire si les propriétés du disque de Win11 sont inconnues ? Récemment, les utilisateurs de Win11 ont constaté que le système provoquait une erreur de disque lors de l'utilisation de leur ordinateur. Et comment le résoudre ? De nombreux amis ne savent pas comment fonctionner en détail. L'éditeur a compilé ci-dessous les étapes pour résoudre l'erreur de disque Win11. Si vous êtes intéressé, suivez l'éditeur pour lire ci-dessous ! Étapes pour résoudre l'erreur de disque Win11 1. Tout d'abord, appuyez sur la combinaison de touches Win+E du clavier ou cliquez sur l'Explorateur de fichiers dans la barre des tâches. 2. Dans la barre latérale droite de l'Explorateur de fichiers, recherchez le côté et cliquez avec le bouton droit sur le local. disque (C :), dans l'élément de menu qui s'ouvre, sélectionnez Propriétés ; 3. Fenêtre Propriétés du disque local (C :), passez à Outils ;
syntaxe de l'attribut inférieur en CSS
Feb 21, 2024 pm 03:30 PM
Syntaxe de l'attribut bottom et exemples de code en CSS En CSS, l'attribut bottom est utilisé pour spécifier la distance entre un élément et le bas du conteneur. Il contrôle la position d'un élément par rapport au bas de son élément parent. La syntaxe de l'attribut bottom est la suivante : element{bottom:value;} où element représente l'élément auquel le style doit être appliqué et value représente la valeur inférieure à définir. la valeur peut être une valeur de longueur spécifique, telle que des pixels
Quel est le rôle de l'attribut pageXOffset en JavaScript ?
Sep 16, 2023 am 09:17 AM
Si vous souhaitez obtenir les pixels vers lesquels le document défile à partir du coin supérieur gauche de la fenêtre, utilisez les propriétés pageXoffset et pageYoffset. Utilisez pageXoffset pour les pixels horizontaux. Exemple Vous pouvez essayer d'exécuter le code suivant pour apprendre à utiliser l'attribut pageXOffset en JavaScript - Démonstration en direct<!DOCTYPEhtml><html> <head> <style> &
Introduction aux attributs du fil du désespoir de Hearthstone
Mar 20, 2024 pm 10:36 PM
Fil du désespoir est une carte rare du chef-d'œuvre de Blizzard Entertainment "Hearthstone" et a une chance d'être obtenue dans le pack de cartes "Wizbane's Workshop". Peut consommer 100/400 points de poussière arcanique pour synthétiser la version normale/or. Introduction aux attributs du Fil du Désespoir de Hearthstone : Il peut être obtenu dans le pack de cartes de l'atelier de Wizbane avec une chance, ou il peut également être synthétisé via de la poussière arcanique. Rareté : Rare Type : Classe de sort : Chevalier de la mort Mana : 1 Effet : Donne à tous les serviteurs un Râle d'agonie : Inflige 1 dégât à tous les serviteurs
Méthodes et exemples d'ajout dynamique d'attributs à l'aide de la fonction Vue.set
Jul 24, 2023 pm 07:22 PM
Méthodes et exemples d'utilisation de la fonction Vue.set pour ajouter dynamiquement des propriétés. Dans Vue, si nous souhaitons ajouter dynamiquement une propriété à un objet existant, nous utilisons généralement la fonction Vue.set. La fonction Vue.set est une méthode globale fournie par Vue.js, qui peut garantir des mises à jour réactives lors de l'ajout de propriétés. Cet article présentera l'utilisation de Vue.set et fournira un exemple spécifique. Premièrement, dans Vue, nous utilisons généralement l'option data pour déclarer des données réactives.
