アスタリスク( * )は、すべての要素に適用されます。上記は、文書内のすべての要素を赤字にします。といってもクラス指定などで指定したところはその指定通りになっています。
アスタリスクで全体を指定しても、個々に指定すればそちらが優先されるようです。
UTF-8：utf-8
シフトJIS：Shift_JIS
EUC：euc-jp
外部スタイルシートファイルの文字コードを指定します。ファイルの先頭行に記述します。
ブラウザは下記の優先順位でCSSファイルの文字コードを判断することが推奨されています。
・HTTPのContent-Typeヘッダにあるcharset情報。
・ファイル先頭のBOM、またはファイル先頭の@charset宣言
・<link charset="">などのメタデータ指定
・スタイルシートやドキュメントが参照する文字コード
・UTF-8
ファイル先頭のBOM
テキストファイルによく使われる文字コード「UTF-8」には「BOM」という仕組みがあります。「BOM」は、「バイトオーダーマーク（Byte Order Mark）」の略でファイルの文字コードが「UTF-8」であることを示します。「BOM」を付ける付けないは自由なので、テキスト保存時に選択できます。「BOM」は付けない方がいいらしいです。（矛盾がありますが無視してください）
背景に色を指定します。
<body>や<table>だけではなく、<p>・<div>・<span>などの要素にも使えます。
イメージ・デザインの統一、デザイン性の向上、オリジナリティ。赤字やマーカーと同様で目立たせる。文字色が浮き出て立体感がでる。目に優しい色が使える。画像に合う色を適応。rgba()で指定することで透明化も可能。
CSS3では、R、G、Bに透明度α(alpha)を加えたrgba(R、G、B、A)が定義されました。R、G、Bは0～255または0～100%で指定、透明度αは0（完全に透明）～1（完全に不透明）の数値（0.01～1.00）で指定します。#ffffffのような16進数で指定することはできません。
背景画像を表示します。
デフォルトは繰り返し表示で、ひとつだけとか、スクロール固定とか設定もできます。
<body>や<table>だけではなく、<p>・<div>・<span>などの要素にも使えます。
背景画像の表示に対して細かな設定ができます。
body {
background-image:url(image/st10.gif);
background-position：center center;
background-repeat: no-repeat;
}
上のように書くと画面の中央に背景として画像1枚だけ表示されます。
その他background-size、background-repeat、background-attachmentなどがあり、設定できます。
ボーダーライン（境界線）の線種、太さ、色をまとめて指定します。（書き順に指定はありません）
border:style（border-style） width（border-width） color（border-color）
値は、
style：solid（実線） dotted（点線） dashed（破線） double（二重線）
width：ピクセル（px）以外も使えますが、ピクセルがいいでしょう。
color：#f33（色コード）、色名（red、blueなど）
隣り合ったテーブルセルの枠線の表示方法を指定します。テーブルを作るときに時々利用します。
collapse：重なり合わせて表示します。
separate：離して表示します。隙間の間隔は border-spacing で調節します。
テキストの色を指定します。上記はクラス指定で「line」と名前を付けたところに適用します。色コードはhtmlでは6桁ですが、スタイルシートは3桁でも使えます。例えば#ff6633の場合、#f63にできます。
例、
<p><span class="line">value属性</span>：ボタンに表示する文字を決めます。このボタンを押すことでメール送信されます。</p>
結果、
value属性：ボタンに表示する文字を決めます。このボタンを押すことでメール送信されます。
他の書き方
CSS3では、R、G、Bに透明度α(alpha)を加えたrgba(R、G、B、A)が定義されました。
要素をどのような形式で表示するかを指定します。上記のプロパティ（flex）の部分、たくさんあるので書きあげてみると、
inline：インラインボックスとして表示します。
block：ブロックボックスとして表示します。
list-item：リストアイテムとして表示します。
inline-block：インラインボックスの様に前後で改行されず、ブロックボックスの様に高さ、横幅を指定可能なボックスです。
run-in：状況に応じて、後続のブロックの先頭インライン要素になります。
compact：状況に応じて、後続のブロックの左余白に表示されるボックスになります。
table：テーブル要素。table要素に該当します。
table-row：テーブルの列。tr要素に該当します。
table-column：テーブルの行。col要素に該当します。
table-cell：テーブルのセル。th要素、td要素に該当します。
table-caption：テーブルのキャプション。caption要素に該当します。
inline-table：インラインレベルのテーブルとなる。
ruby：ルビ。ruby要素に該当します。
flex：フレックスコンテナとして表示します。詳細はflexを参照してください。
inline-flex：インラインのフレックスコンテナとして表示します。
などです。
これまでに少しだけですが勉強したのは以下の「flex」だけなので、そちらで説明します。
基礎知識
コンテンツを横に並べるには、初期の時代はテーブルが使用されていました。CSS1～CSS2 の時代には、float:left と clearfix を用いた手法が用いられていましたが、今後は CSS3 で策定中のフレキシブルボックス(フレックスボックス)が主流になると思われます。ただ、CSS3 での仕様が数回変更されていることや、IE でのサポートが遅れたことから、一般的に使用されるには、もう少しだけ時間がかかりそうです。
フレキシブルボックスを用いて、コンテンツを横方向に並べることができます。並べる要素をフレックスアイテム、それを包含する要素をフレックスコンテナと呼びます。display に flex を指定することでフレックスコンテナを作成します。フレックスコンテナの子要素はフレックスアイテムとして扱われます。
例えば、以下のようにサイズの小さな5枚の写真を用意します。
1枚の写真を<div>で囲んで名前も表示すると、
写真5枚を同様に処理すると、写真は縦に並んでしまいます。
画像の回り込みにも使いますが、勉強したのは<div>の横配置です。（通常、<div>は改行して終わるため次の<div>は下の配置になります）
floatは一度指定するとず～っと続くため、終了を「clear」で指定します。
float:right;もあります。float:left;の場合はclear:left;、float:right;の場合はclear:right;が必要ですが、clear:both;で両方に対応できます。
<div>の並びには今後「float」ではなく「flex」を使う機会が多くなると思いますので、説明はこのくらいで。
font: style weight size/height family;
フォントのスタイル、（変換）、太さ、サイズ、表示高さ、ファミリ（font-familyを指定）をまとめて指定します。
font: style（font-style） weight（font-weight） size（font-size） height（line-height） family（font-family）;
書き方は、
style：normal（通常のフォント）、italic（斜体のフォント）
weight：normal（通常の太さ）、bold（太字）、lighter（より細く）、bolder（より太く）
size：small（少し小さく）、large（少し大きく）、16px（ピクセル単位）、130%（標準に対する比率）
height（行の高さは、size の後に / height で指定）：
16px（行の高さをピクセル単位で）、200%（行の高さを比率で）
family：serif（明朝体など）、sans-serif（ゴシック体など）、cursive（筆記体）、fantasy（装飾の多い文字）、monospace（等倍フォントなど）
フォントをカンマで区切って複数指定すると、最初のものから順に探し、最初に見つかったフォントを利用します。下記の例では、Windows では「メイリオ」が無ければ「ＭＳ Ｐゴシック」、Mac では「ヒラギノ角ゴシック」が無ければ Osaka、いずれも無ければ sans-serif フォントを利用します。
例：（font-familyで書きます）
font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, sans-serif;