CSSを使用して2行後に段落のドットを表示する方法

方法1: ::after擬似要素を使用する方法

この方法では、CSSの::after擬似要素を使用して、段落の後にドットを表示します。以下のCSSコードを使用します。

p::after {
  content: "•";
  display: inline-block;
  margin-left: 5px;
}

このコードは、各段落の後にドットを表示します。contentプロパティで表示するテキストやシンボルを指定し、必要に応じてmargin-leftプロパティでドットとテキストの間のスペースを調整できます。

方法2: JavaScriptを使用する方法

JavaScriptを使用して、特定の要素のテキストを取得し、その後にドットを追加する方法もあります。以下は、JavaScriptを使用した例です。

const paragraphs = document.querySelectorAll('p');
paragraphs.forEach((paragraph) => {
  const text = paragraph.textContent;
  paragraph.textContent = text + ' •';
});

このコードは、すべての<p>要素を取得し、それぞれのテキストの末尾にドットを追加します。