conflicting/Learn/CSS 以下を削除 (#1474)

- 各記事を 2021/07/10 時点の英語版に同期
- conflicting 版の記事は古いため削除

1 files changed, 27 insertions, 18 deletions

diff --git a/files/ja/learn/css/building_blocks/index.html b/files/ja/learn/css/building_blocks/index.html
index 3094d16d9c..0a6c343bdd 100644
--- a/files/ja/learn/css/building_blocks/index.html
+++ b/files/ja/learn/css/building_blocks/index.html
@@ -14,30 +14,39 @@ translation_of: Learn/CSS/Building_blocks
 
 <p class="summary">ここでの目的は、<a href="/ja/docs/Learn/CSS/Styling_text">テキストの装飾</a>や <a href="/ja/docs/Learn/CSS/CSS_layout">CSS レイアウト</a>などのより具体的な分野に進む前に、適切な CSS を書くための手法を知り、すべての重要な理論を理解できるようになることです。</p>
 
-<h2 id="Prerequisites" name="Prerequisites">前提知識</h2>
+<div class="callout">
+  <h4 id="Looking_to_become_a_front-end_web_developer">フロントエンドのウェブ開発者を目指している方へ</h4>
 
-<p>このモジュールを始めるまえに、つぎの状態になっておくべきです。</p>
+  <p>目標に向かって努力するために必要なすべての必須情報を含むコースをまとめました。</p>
+
+  <p><a href="/ja/docs/Learn/Front-end_web_developer"><strong>始めましょう</strong></a></p>
+
+</div>
+
+<h2 id="Prerequisites">前提知識</h2>
+
+<p>このモジュールを始める前に、次のものを身につけておいてください。</p>
 
 <ol>
- <li>コンピューターの使い方と（ウェブを見たりコンテンツを消費したりといった）ウェブの受動的な使い方に関する基本的な知識に慣れ親しんでいること。</li>
- <li><a href="https://developer.mozilla.org/ja/docs/Learn/Getting_started_with_the_web/Installing_basic_software">基本的なソフトウェアのインストール</a>で説明されている基本的な作業環境と、<a href="https://developer.mozilla.org/ja/docs/Learn/Getting_started_with_the_web/Dealing_with_files">ファイルの扱い方</a>で説明されているファイルの作り方や管理の仕方について理解していること。</li>
+ <li>コンピューターの使い方と (ウェブを見たりコンテンツを消費したりといった) ウェブの受動的な使い方に関する基本的な知識に慣れ親しんでいること。</li>
+ <li><a href="/ja/docs/Learn/Getting_started_with_the_web/Installing_basic_software">基本的なソフトウェアのインストール</a>で説明されている基本的な作業環境と、<a href="/ja/docs/Learn/Getting_started_with_the_web/Dealing_with_files">ファイルの扱い方</a>で説明されているファイルの作り方や管理の仕方について理解していること。</li>
  <li><a href="/ja/docs/Learn/HTML/Introduction_to_HTML">HTML 入門</a>で説明されている HTML についての基礎知識に慣れ親しんでいること。</li>
  <li><a href="/ja/docs/Learn/CSS/First_steps">CSS の第一歩</a>で説明されている CSS の基本について理解していること。</li>
 </ol>
 
 <div class="note">
-<p><strong>注</strong>: 自分自身でファイルを作れない環境 (タブレットやその他の端末) で作業する場合、(ほとんどの) コードサンプルは <a href="http://jsbin.com/">JSBin</a> や <a href="https://glitch.com/">Glitch</a> といったオンラインコーディングプログラムで試すことが可能です</p>
+<p><strong>注</strong>: 自分自身でファイルを作れない環境 (タブレットやその他の端末) で作業する場合、(ほとんどの) コードサンプルは <a href="https://jsbin.com/">JSBin</a> や <a href="https://glitch.com/">Glitch</a> といったオンラインコーディングプログラムで試すことが可能です</p>
 </div>
 
-<h2 id="Guides" name="Guides">ガイド</h2>
+<h2 id="Guides">ガイド</h2>
 
-<p>このモジュールは CSS 言語のもっとも重要な部分をカバーする以下の記事で構成されます。各記事には理解度を試すエクササイズも含まれます。</p>
+<p>このモジュールは、 CSS 言語のもっとも重要な部分をカバーする以下の記事で構成されています。各記事には理解度を試す練習問題も含まれています。</p>
 
 <dl>
  <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance">カスケードと継承</a></dt>
- <dd>このレッスンでの目的は、CSS を HTML に適用する方法と競合した場合の解決方法について、もっとも基本的な概念（カスケード・詳細度・継承）の理解を深めていくことです。</dd>
+ <dd>このレッスンでの目的は、CSS を HTML に適用する方法と競合した場合の解決方法について、もっとも基本的な概念 (カスケード・詳細度・継承) の理解を深めていくことです。</dd>
  <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Selectors">CSS セレクター</a></dt>
- <dd>CSS セレクターにはさまざまな種類があり、スタイルを設定する要素を厳密に指定することができます。この記事と以下のサブ記事では、それらがどのように機能するかを詳しく見ていきます。サブ記事は以下の通りです:
+ <dd>CSS セレクターにはさまざまな種類があり、スタイルを設定する要素を厳密に指定することができます。この記事と以下のサブ記事では、それらがどのように機能するかを詳しく見ていきます。サブ記事は以下の通りです。
  <ul>
   <li><a href="/ja/docs/Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors">要素・クラス・ID によるセレクター</a></li>
   <li><a href="/ja/docs/Learn/CSS/Building_blocks/Selectors/Attribute_selectors">属性によるセレクター</a></li>
@@ -51,10 +60,10 @@ translation_of: Learn/CSS/Building_blocks
  <dd>このレッスンでは、CSS の背景と枠線を使ってできるクリエイティブなことをいくつか見ていきます。グラデーションや背景画像や角丸について、背景と枠線は CSS のスタイリングに関する多くの疑問の解決策です。</dd>
  <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Handling_different_text_directions">テキスト方向の操作</a></dt>
  <dd>近年では、右から左へだけでなく上から下へのコンテンツ（日本語など）を含むコンテンツのさまざまな向きをより適切にサポートするために CSS サポートが進化しています。これらのさまざまな向きの考え方については "<strong>writing modes" </strong>と呼ばれます。レイアウトの学習を進めて進めていくと "writing modes" の理解がとても役に立っていきますので、この記事ではそれらを紹介していきます。</dd>
- <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Overflowing_content">要素のはみ出し（オーバーフロー）</a></dt>
- <dd><font><font>このレッスンでは、CSS のもう 1 つの重要な概念である </font></font><strong><font><font>オーバーフロー（</font></font></strong><strong><font><font>overflow）</font></font></strong><font><font>を見ていきます</font><font>。</font><font>オーバーフローは、ボックス内にコンテンツが収まりきらないときに発生します。</font><font>このガイドでは、その詳細とそれらについてどのように対処するかを学びます。</font></font></dd>
+ <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Overflowing_content">コンテンツのはみ出し (オーバーフロー)</a></dt>
+ <dd>このレッスンでは、CSS のもう 1 つの重要な概念である <strong>オーバーフロー</strong> (<strong>overflow</strong>) を見ていきます。オーバーフローは、ボックス内にコンテンツが収まりきらないときに発生します。このガイドでは、その詳細とそれらについてどのように対処するかを学びます。</dd>
  <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Values_and_units">CSS の値と単位</a></dt>
- <dd><font>CSS で使用されるすべてのプロパティには、特定の値または値の組み合わせのみが許可されます。</font><font>このレッスンでは、もっともよく使用される値と単位について見ていきます。</font></dd>
+ <dd>CSS で使用されるすべてのプロパティには、特定の値または値の組み合わせのみが許可されます。このレッスンでは、もっともよく使用される値と単位について見ていきます。</dd>
  <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Sizing_items_in_CSS">CSS によるサイズ設定</a></dt>
  <dd>これまでのさまざまなレッスンで、CSS を使用してウェブページ上の項目のサイズを調整するいくつかの方法に出会いました。デザイン作業をしていくうえで、それぞれの手法がどれほど大きく異なっているのかを理解することが重要です。このレッスンでは、CSS によって要素のサイズを設定する方法をまとめ、サイジングに役立ついくつかの用語を定義します。</dd>
  <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Images_media_form_elements">画像・メディア・フォーム要素</a></dt>
@@ -67,22 +76,22 @@ translation_of: Learn/CSS/Building_blocks
  <dd>スタイルシートやプロジェクトが大きい状態で作業しはじめると、巨大な CSS ファイルを維持するのが難しいことがわかります。この記事では、保守しやすい CSS を書くためのベストプラクティスと、他の人が保守性を向上させるための解決策の一部を紹介します。</dd>
 </dl>
 
-<h2 id="Assessments" name="Assessments">評価</h2>
+<h2 id="Assessments">評価テスト</h2>
 
 <p>CSS スキルをテストしたいですか？以下の各評価では上記のガイドで説明されている CSS の理解度をテストできます。</p>
 
 <dl>
- <dt><a href="/ja/docs/Learn/CSS/Introduction_to_CSS/Fundamental_CSS_comprehension">基本的な CSS の理解</a></dt>
+ <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Fundamental_CSS_comprehension">基本的な CSS の理解</a></dt>
  <dd>この評価では基本的な構文・セレクター・詳細度・ボックスモデル・その他の理解度をテストします。</dd>
- <dt><a href="/ja/docs/Learn/CSS/Styling_boxes/Creating_fancy_letterheaded_paper">装飾的なレターヘッド付きの便箋の作成</a></dt>
+ <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Creating_fancy_letterheaded_paper">装飾的なレターヘッド付きの便箋の作成</a></dt>
  <dd>好印象を与えたいのなら、素敵なレターヘッドの便箋に手紙を書くのはとても良い考えです。この評価では、そのような見た目のオンラインテンプレートの作成に挑戦します。</dd>
- <dt><a href="/ja/docs/Learn/CSS/Styling_boxes/A_cool_looking_box">かっこいいボックス</a></dt>
+ <dt><a href="/ja/docs/Learn/CSS/Building_blocks/A_cool_looking_box">かっこいいボックス</a></dt>
  <dd>ここでは背景と枠線のスタイリングを使った人目を引くボックスの作り方を実践します。</dd>
 </dl>
 
-<h2 id="See_also" name="See_also">関連情報</h2>
+<h2 id="See_also">関連情報</h2>
 
 <dl>
- <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Advanced_styling_effects">ボックスの高度なエフェクト</a></dt>
+ <dt><a href="/ja/docs/Learn/CSS/Building_blocks/Advanced_styling_effects">ボックスの高度な効果</a></dt>
  <dd>この記事はトリックの箱として機能し、ボックスの影・ブレンドモード・フィルターのような、ボックスの装飾に使用できる高度な機能のいくつかを紹介します。</dd>
 </dl>