CSSを使用してHTMLページをスタイリングするのは最初は難しい場合がありますので、開始するための基本は次のとおりです。

まず、HTMLファイルとCSSファイルを作成する必要があります。この例では、HTMLファイルはindex.htmlとCSSファイルstyle.cssと呼ばれます。
Insided.html内では、CSSファイルを使用して使用できるようにインポートする必要があります。これを行うには、index.htmlファイル内の<head> </head>タグ内に次の行を追加します。
`` `
<link rel = "styleSheet" href = "style.css">
`` `

 - すべてのCSSフィールドには、タグとIDまたはクラスのいずれか、次にブラケットが続く必要があります。そうするはずです：
`` `
p {

}
`` `
 - ブラケットの内側は、変更する属性を置く場所です。この例に従うことはできますが、w3schools.comなどのCSSドキュメントサイトを必ず確認する必要があります。

このコードは、次のプロパティでHTML <P>タグのスタイルを変更します：色（テキスト色）と背景色（<P> HTMLタグの背景の色）。
`` `
p {
    色：緑;
    背景色：赤;
}
`` `

HTMLでは、IDとクラスを使用して、コードの部分をよりよく識別できます。クラスとIDを使用して、多くのタグをグループ化して、一度にスタイルをスタイリングできます！
次の例では、class = "要素" HTML属性を使用してすべてのアイテムをスタイリングします。

通常のHTMLタグには、名前を付けるだけでアクセスできます。
HTMLクラスは、名前の前にドット（。）を使用してCSSからアクセスされます。
HTML IDは、名前のfronでハッシュタグ（＃）を使用してCSSからアクセスされます。

3つのCSSタグすべてを示す例が次のとおりです。
`` `
/*通常のHTMLタグは、HTMLでは何でもできます。たとえば、a <div>は次の*/
div {
    / * ... */
}

/ *これは「入力フィールド」という名前のクラスの例です */
.input-field {
    / * ... */
}

/ *これは、「メインタイトル」と呼ばれるHTML IDの例です */
＃メインタイトル {
    / * ... */
}
`` `

index.html
`` `
<div class = "element">
    <p>赤い背景があります！</p>
</div>
<div>
    <p>私はスタイリングされていません！</p>
</div>
<div class = "element">
    <p>私も赤い背景を持っています！</p>
</div>
`` `

style.css
`` `
。エレメント {
    背景色：赤;
}
`` `

これがあなたが始めるのに役立つことを願っています！
Styling an HTML page with CSS can be hard at first, so here are the basics to get started:

First you need to create an HTML file and a CSS file. In this example, the HTML file will be called index.html and the CSS file style.css.
Inside index.html, you will need to import the CSS file to be able to use it. To do so, add the following line inside your <head> </head> tags inside your index.html file.
```
<link rel="stylesheet" href="style.css">
```

- every CSS field should have either a tag, and ID or a class, followed by brackets. It should look like so:
```
p {

}
```
- Inside the brackets is where you put the attributes you want to modify. You can follow this example, but you should definitely check CSS documentation sites, such as W3Schools.com.

This code will change the style of your HTML <p> tags with the following properties: color (text color) and background-color (the color of the background of the <p> HTML tag).
```
p {
    color: green;
    background-color: red;
}
```

In HTML, you can use IDs and Classes to better identify parts of your code. You can use classes and IDs to group together many tags and style them all at once!
In the following example, we will be styling all items with the class="element" HTML attribute.

Regular HTML tags are accessed by simply putting their name. 
HTML classes are accessed from CSS by using a dot (.) in front of the name. 
HTML IDs are accessed from css by using a hashtag (#) in fron of the name.

Here is an example showing all three CSS tags:
```
/* Regular HTML tag, can be anything in HTML. For example, a <div> would be the following*/
div {
    /* ... */
}

/* This is an example for a class named "input-field" */
.input-field {
    /* ... */
}

/* This is an example for an HTML ID called "main-title" */
#main-title {
    /* ... */
}
```

index.html
```
<div class="element">
    <p>I have a red background!</p>
</div>
<div>
    <p>I am not styled!</p>
</div>
<div class="element">
    <p>I too have a red background!</p>
</div>
```

style.css
```
.element {
    background-color: red;
}
```

I hope this helped you getting started!