Effets textuels

3 min 1 exercice Niveau 6

Énoncé

Soit le code suivant :

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Microlead - Exercice 1 CSS</title>
</head>
<body>
    <h1>Microlead</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed consectetur eu lorem nec convallis. Sed congue convallis nibh, ac mattis ante. Cras aliquam, nisl et tempor lacinia, odio sem maximus arcu, eget consectetur dolor magna vulputate purus. Proin vitae ultrices urna, nec dignissim risus. Duis nec mollis ex. Sed vel vestibulum sapien. Phasellus sem ex, sollicitudin finibus gravida a, luctus sit amet magna. Nam malesuada libero nec massa rhoncus, non luctus tellus euismod. Nunc gravida urna in mauris efficitur pellentesque. Vivamus pulvinar enim turpis, sit amet sollicitudin neque lobortis vitae. Vestibulum volutpat elementum enim et volutpat. Cras vel risus posuere, efficitur eros sed, suscipit mi. Sed eget iaculis tortor, sit amet tristique dui. In at nulla nec ante dignissim cursus sed ac ante.</p>
</body>
</html>

Modifier le code afin de :

  • Faire en sorte que le paragraphe fasse 300 pixels de large au maximum et que le texte à l'intérieur ne pouvant s'afficher soit caché et remplacé par 3 petits points (...)

Contraintes

Les langages utilisés doivent être uniquement le HTML et le CSS.

Résultats attendus

Le résultat suivant est visible lors du chargement de la page HTML au sein de votre navigateur :

  • Le texte ne dépasse plus et trois petits points apparaissent.
logo discord

Besoin d'aide ?

Rejoignez notre communauté officielle et ne restez plus seul à bloquer sur un problème !

En savoir plus