要素内の直下の子要素を選択するセレクタはこちらの記事を参照してください。
(要素) (下位の要素){ (スタイル記述) }
.blue p {
color:#0000FF;
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link rel="stylesheet" type="text/css" href="DescendantSelector.css" />
</head>
<body>
<div>何も設定していないdiv</div>
<p>何も設定していないpタグ</p>
<div class="blue">
blueクラス内の記述
<p>blueクラス内のpタグ</p>
<blockquote>
<p>blueクラス内のBlockQuote内のpタグ</p>
</blockquote>
</div>
</body>
</html>
.Container .FrameA span {
text-decoration:underline;
color:#A00000;
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link rel="stylesheet" type="text/css" href="DescendantSelector2.css" />
</head>
<body>
<div class="Container">
<div class="FrameA">
<p>Containerクラス内のFrameAクラス内のpタグ<br />
<span>Containerクラス内のFrameAクラス内のpタグ内のspan</span><br />
</p>
<span>Containerクラス内のFrameAクラス内のspan</span><br />
</div>
<span>Containerクラス内のspan</span><br />
</div>
</body>
</html>