Decoration underline
Eritou
Messages postés
110
Date d'inscription
Statut
Membre
Dernière intervention
-
Eritou Messages postés 110 Date d'inscription Statut Membre Dernière intervention -
Eritou Messages postés 110 Date d'inscription Statut Membre Dernière intervention -
Bonsoir,
Comment changer une décoration underline, sa couleur (la endre différente de celle du texte) et rendre le souligné justifié sur une colonne (ne pas se limiter au texte) ?
Merci et bonne soirée,
E.
Comment changer une décoration underline, sa couleur (la endre différente de celle du texte) et rendre le souligné justifié sur une colonne (ne pas se limiter au texte) ?
Merci et bonne soirée,
E.
A voir également:
- Decoration underline
- Jeux de décoration de maison à télécharger gratuitement - Télécharger - Divers Jeux
- Logiciel décoration intérieur gratuit - Guide
- Logiciel decoration interieur gratuit - Télécharger - Architecture & Déco
- Decoration page word - Guide
- Text-decoration: none; ne fonctionne pas - Forum Webmastering
1 réponse
Bonsoir,
si vous parlez du cadre la propriété border est une notation raccourcie des propriétés border-style, border-width, border-color qui correspondent respectivement à style de a bordure(souligné, pointillé, doublé etc...).
http://www.w3schools.com/css/css_border.asp
Pour le texte c'est la propriété text-decoration qui n'a évidemment rien à voir avec la justification du texte.
Que le texte soit souligné ou pas c'est autre chose.
text-align: qui prendra les valeurs droite, gauche, centrées...
Si vous voulez des colonnes le plus simple est de créer d'abord les colonnes et d'y mettre votre texte, donc rien à voir non plus avec la justification puisque 3 colonnes par exemple serais simplement trois balises de textes alignées horizontalement que l'on va remplir à la suite.
Par exemple:
https://jsbin.com/diqumapone/edit?html,output
(ou en copié collé direct ici)
Comme c'est pas beau et pas très lisible(surtout si on enlève la bordure de pointillé rouge) on peut remettre des marges internes/externes mais la largeur(width) devra en être modifiée en conséquence.
si vous parlez du cadre la propriété border est une notation raccourcie des propriétés border-style, border-width, border-color qui correspondent respectivement à style de a bordure(souligné, pointillé, doublé etc...).
http://www.w3schools.com/css/css_border.asp
Pour le texte c'est la propriété text-decoration qui n'a évidemment rien à voir avec la justification du texte.
Que le texte soit souligné ou pas c'est autre chose.
text-align: qui prendra les valeurs droite, gauche, centrées...
Si vous voulez des colonnes le plus simple est de créer d'abord les colonnes et d'y mettre votre texte, donc rien à voir non plus avec la justification puisque 3 colonnes par exemple serais simplement trois balises de textes alignées horizontalement que l'on va remplir à la suite.
Par exemple:
https://jsbin.com/diqumapone/edit?html,output
(ou en copié collé direct ici)
<!DOCTYPE html>
<html>
<head>
<!-- évidemment il est mieux d'utiliser une feuille de style externe liée-->
<style rel=stylesheet>
p.troiscolonnes{
margin:0;
padding:0;/* margin et padding sont mis à zéro, c'est la taille de la marge extérieure et intérieure qui ne l'est pas par défaut*/
float:left;
width:32%;
border:1px dotted red;/*la bordure ne sert qu'à mieux voir les contours*/
text-align:justify;
}
</style>
</head>
<body>
<p class=troiscolonnes>Une première colonne de texte ...
Une première colonne de texte
</p>
<p class=troiscolonnes>Deuxième colonne blablabla blablabla
Deuxième colonne
Deuxième colonne
Deuxième colonne
</p>
<p class=troiscolonnes>une troisième colonne de texte lorem ipsum ... tagada une troisième colonne de texteune troisième colonne de texteune troisième colonne de texte</p>
</body>
</html>
Comme c'est pas beau et pas très lisible(surtout si on enlève la bordure de pointillé rouge) on peut remettre des marges internes/externes mais la largeur(width) devra en être modifiée en conséquence.
p.troiscolonnes{
margin:3%;
padding:0;
float:left;
/*il y a 3% de chaque côté de chacune des balises p donc 6% par balise= 18% occupée par la marge*/
width:26%;/*Les 32% précédents de largeur de chaque balise on lui enlève les 6% de marge 32-6=26 car si le total dépasse 100% le troisième bloc ne sera pas sur la même ligne*/
border:1px dotted red;/*la bordure ne sert qu'à mieux voir les contours*/
text-align:justify;
}
p.troiscolonnes{ margin:0; padding:0.45em;/* les marges internes sont de 0.45em(quadratin typographique, s'il vaut 1 ça correspond à la hauteur de la ligne de texte-interligne- Pour 0.45 c'est 45% de l'interligne*/ float:left; width:31%; border-right:2px ridge #002;/*la bordure n'est plus un repère pour la construction mais intégré au design en tant que barre pour séparer les colonnes, dans l'idéal on la supprimerais pour le dernier des 3 blocs, ce que je n'ai pas fait ici*/ text-align:left; }Bonne soirée et merci pour ta réponse ;)
E.