【下線】テキストに点線で下線［その2］

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>p{display:inline;}

/* cssで下線-2 */
.under-dot {
  border-bottom: 1px dotted #555;
}

.under-dot-pink {
  border-bottom: 1px dotted #ff1481;
}</style>
</head>
<body>
<div>
<p class="under-dot">テキストに点線で下線</p>
</div>
<div>
<p class="under-dot-pink">テキストに点線で下線</p>
</div>
<script>
</script>
</body>
</html>

p{display:inline;}

/* cssで下線-2 */
.under-dot {
  border-bottom: 1px dotted #555;
}

.under-dot-pink {
  border-bottom: 1px dotted #ff1481;
}