CSS INDENT Deuxième ligne

Une feuille de style en cascade est un code de style qui est ajouté aux balises HTML pour améliorer le travail et l'apparence du contenu HTML. Parmi les nombreux effets du CSS, l'une des propriétés fondamentales du style du contenu est d'appliquer une feuille de style au texte, y compris la couleur du texte, la famille, la taille et l'emplacement. L'une des propriétés de texte de CSS sera expliquée dans cet article. Ceci est une propriété d'empreintes. Le retrait signifie le déplacement du texte d'un certain point à un endroit spécifique.

Propriété de texte en texte

Tout en visualisant certains sites Web éducatifs, vous devez avoir vu de tels paragraphes ou zones de texte qui commencent par la première ligne à une distance de tout un paragraphe, ce qui le rend plus important et attrayant. Cela se fait en faisant la première ligne du texte en retrait. Non seulement la première ligne, mais nous pouvons également induire la deuxième ligne en gardant la première ligne intacte. Cette propriété de texte est prise en pixel ou en pourcentages. La syntaxe pour l'indentation du texte est:

Texte-indent: valeur;

Cette propriété peut être appliquée sur n'importe quel contenu HTML. Cependant, maintenant nous appliquerons cette propriété sur le texte. HTML et CSS sont tous deux les langues de l'épine dorsale pour le développement frontal et la conception d'une page Web. HTML contient deux sections de base: les sections de la tête et du corps. Ces deux parties sont décrites avec les balises:

… .

Tous les contenus HTML sont décrits dans les sections du corps. La section Head contient le titre de la page Web et le CSS s'il s'agit de CSS interne. Les balises HTML de base utilisées dans cet article seront expliquées au moment de la mise en œuvre. En parlant de la déclaration CSS, nous avons utilisé le CSS interne parmi trois types CSS. Les propriétés CSS sont déclarées à l'intérieur de la balise de style, qui est déclarée dans la balise de tête.

Il existe plusieurs approches pour accélérer la deuxième ligne du paragraphe HTML. Certaines des méthodes simples sont expliquées ci-dessous.

Exemple 1

Tout d'abord, nous avons utilisé un exemple pour appliquer la propriété CSS de l'emplacement sur un texte de paragraphe de HTML. Comme le montre le nom de l'article, nous devons mettre en place la deuxième ligne du texte. Dans cet exemple, nous avons appliqué la propriété d'impos. Cependant, le paragraphe de la deuxième ligne sera en retrait. Commençons par l'exemple de code. Tout d'abord, considérez la section du corps, où une étiquette de paragraphe simple est utilisée pour appliquer le retrait.

Une rubrique simple est déclarée, que nous n'appliquerons aucun effet. La balise de paragraphe est déclarée à l'intérieur du div. C'est un conteneur qui maintient le contenu HTML à un point spécifique. De même, ici, nous déclarerons un div. Une classe est également déclarée ici.

Dans CSS, la conception se fait via les ID ou les classes. Tous les effets que nous voulons appliquer sont écrits dans la déclaration de classe dans le corps CSS. Dans la partie tête, nous devons mentionner le nom au point où nous voulons appliquer ces effets.

Fermez également toutes les balises et le corps HTML. Une fois le contenu HTML déclaré, un seul paragraphe et un titre seront affichés lorsque vous exécutez la page sur le site Web. Nous utiliserons le code CSS suivant pour appliquer des effets à ce sujet.

En direction de la balise de style, une div pour la classe est expliquée avec les fonctionnalités que nous voulons appliquer à ce conteneur. L'indéont textuel de -36px est utilisé, ce qui signifie que la première ligne ne sera pas en retrait. Cependant, la première ligne est déplacée vers la gauche par rapport aux lignes de paragraphe restantes. Cela se fait en déclarant le rembourrage du côté gauche de la div 36px. Les deux valeurs sont définies en unités de pixels.

div.un
Texte-indent: -36px;
padding-gauche: 36px;

La propriété de rembourrage est pour le contenu intérieur, que l'extérieur contrôle. C'est la distance entre la limite du texte et la limite du conteneur div. Maintenant, enregistrez le code avec l'extension HTML et exécutez la page Web sur le navigateur.

Vous verrez une simple rupture. Un paragraphe a la première ligne intacte, mais la seconde et toutes les autres lignes sont déplacées vers la droite. La propriété textuelle de CSS fait cela.

Exemple 2

La propriété Text-Indente sera appliquée à l'en-tête de cet exemple. Une simple rubrique est déclarée. Après cela, nous avons utilisé la balise de paragraphe pour y ajouter du texte. L'ID dans le conteneur div sera appliqué à l'ensemble div. Les effets décrits dans la classe ont été appliqués.

À l'intérieur de la section Head, une balise de style contiendra les fonctionnalités d'ID. Le div reçoit une marge et la largeur à appliquer. L'ID est déclaré avec un signe de hachage avec.

Pour appliquer des effets sur le paragraphe spécifiquement, nous devons mentionner «p» avec l'ID. La bordure au-dessus du paragraphe est donnée avec la couleur et la taille. L'effet de rembourrage est appliqué. C'est la distance entre le paragraphe et le titre. Les deux caractéristiques gauche sont la taille du texte et le poids du paragraphe. Ce sera sans la caractéristique en retrait du texte. L'en-tête est appliquée avec la propriété de texte texte de -26 pixels et rembourrer la tête vers la gauche avec la même valeur avec un signe positif.

#Container H2
Texte-indent: -26px;
Padding-Left: 26px;

Enregistrez le code et exécutez le fichier pour examiner la sortie.

Lors de l'exécution, vous verrez que le cap est affiché de sorte que la deuxième ligne de la tête est en retrait vers la direction de gauche. Cependant, la première ligne reste la même.

Note: Pour faire la deuxième ligne du texte soit dans le paragraphe, soit en se dirigeant en retrait, nous devons prendre la valeur de l'indents de texte dans une direction négative. Dans le même temps, le rembourrage du texte doit être effectué dans la direction de gauche avec la valeur positive. L'utilisateur doit confirmer que ces deux valeurs devraient être les mêmes. Dans les deux exemples, nous avons appliqué le même concept.

Conclusion

La propriété CSS INDENT pour la deuxième ligne est une caractéristique essentielle du contenu texte qui est appliqué aux paragraphes et à des titres pour discriminer ce texte à d'autres en rendant le texte attrayant à l'utilisateur. Les valeurs de retrait peuvent également être prises en pixels et en pourcentages. Cette propriété est appliquée aux première et deuxième lignes du paragraphe. L'indétent texte de la deuxième ligne de la ligne de CSS est accompli en ayant la valeur avec un signe négatif et la même valeur pour le rembourrage avec un signe positif. La direction du rembourrage doit être prise comme à gauche. Nous avons utilisé deux exemples pour développer ce concept de texte-indent qui sera suffisant pour améliorer vos connaissances concernant les propriétés du texte.