CSSスタイルシートのリンク要素（link rel=stylesheet）の使用方法と役割

以下に、link要素の使用方法と役割についての詳細を説明します。

リンク要素の追加方法: HTMLのhead要素内で、link要素を以下のように追加します。
```
<link rel="stylesheet" href="styles.css">
```
上記の例では、href属性にスタイルシートファイルのパス（styles.css）を指定しています。このパスは、ウェブサイトのルートディレクトリからの相対パスまたは絶対パスで指定することができます。
外部スタイルシートの利点:
- 再利用性: 外部スタイルシートは複数のウェブページで共有することができ、同じスタイルを繰り返し記述する必要がありません。
- メンテナンス性: スタイルの変更や修正が必要な場合、外部スタイルシートのみを編集すれば、全てのウェブページに反映されます。
- ページの読み込み時間の短縮: 外部スタイルシートはブラウザにキャッシュされるため、ページの読み込み時間が短縮されます。
コード例: 以下は、外部スタイルシートを使用するためのコード例です。
```
<!DOCTYPE html>
<html>
<head>
 <link rel="stylesheet" href="styles.css">
</head>
<body>
 <h1>ウェブページのタイトル</h1>
 <p>テキストの例文</p>
</body>
</html>
```
上記の例では、styles.cssという名前のスタイルシートファイルをリンクしています。このファイル内には、セレクタとプロパティの組み合わせが含まれており、ウェブページの要素にスタイルが適用されます。

以上が、link rel=stylesheetを使用してCSSスタイルシートを結び付ける方法の概要です。この方法を使うことで、ウェブページのデザインやレイアウトを効果的に制御することができます。